@pega/cosmos-react-core 5.0.0-dev.10.4 → 5.0.0-dev.10.6

package/lib/components/AppShell/Drawer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Drawer.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/Drawer.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AA+BvC,UAAU,eAAe;IACvB,OAAO,EAAE,SAAS,CAAC;IACnB,MAAM,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,UAAU,EAAE,OAAO,CAAC;IACpB,aAAa,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;CACxC;sGASE,eAAe;AAPlB,wBAgGE"}
+{"version":3,"file":"Drawer.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/Drawer.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AA+BvC,UAAU,eAAe;IACvB,OAAO,EAAE,SAAS,CAAC;IACnB,MAAM,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,UAAU,EAAE,OAAO,CAAC;IACpB,aAAa,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;CACxC;sGASE,eAAe;AAPlB,wBAyFE"}

package/lib/components/AppShell/Drawer.js

@@ -16,7 +16,7 @@ export default ({ content, header, onDrawerOpen, onDrawerClose, drawerOpen, setD
     const t = useI18n();
     const theme = useTheme();
     const { focusedImperatively } = useContext(AppShellContext);
-    const { ltr, rtl } = useDirection();
+    const { start } = useDirection();
     const returnFocusRef = useRef();
     const [drawerEl, setDrawerEl] = useElement();
     const drawerRef = useConsolidatedRef(setDrawerEl);
@@ -36,7 +36,7 @@ export default ({ content, header, onDrawerOpen, onDrawerClose, drawerOpen, setD
             }
         }
     };
-    return (_jsx(Configuration, { theme: navTheme, portalTarget: drawerEl ?? undefined, children: _jsxs(Drawer, { role: 'dialog', "aria-labelledby": headerId, as: StyledDrawerWrapper, position: 'fixed', placement: 'left', open: drawerOpen, nullWhenClosed: true, onBeforeOpen: () => {
+    return (_jsx(Configuration, { theme: navTheme, portalTarget: drawerEl ?? undefined, children: _jsxs(Drawer, { role: 'dialog', "aria-labelledby": headerId, as: StyledDrawerWrapper, position: 'fixed', placement: start, open: drawerOpen, nullWhenClosed: true, onBeforeOpen: () => {
                 returnFocusRef.current = document.activeElement ?? undefined;
             }, onAfterOpen: () => {
                 if (backButtonRef.current && document.activeElement !== backButtonRef.current) {
@@ -47,6 +47,6 @@ export default ({ content, header, onDrawerOpen, onDrawerClose, drawerOpen, setD
             }, onAfterClose: () => {
                 onDrawerClose?.();
                 returnFocusRef.current?.focus();
-            }, onOuterClick: () => setDrawerOpen(false), ref: drawerRef, children: [_jsxs(Flex, { as: StyledDrawerHeading, container: { alignItems: 'center' }, children: [rtl && (_jsx(Text, { variant: 'h2', id: headerId, children: header })), _jsx(BareButton, { as: StyledDrawerBackButton, ref: backButtonRef, onClick: () => setDrawerOpen(false), "aria-label": t('close_noun', [header]), children: _jsx(Icon, { name: 'arrow-left' }) }), ltr && (_jsx(Text, { variant: 'h2', id: headerId, children: header }))] }), _jsx(Flex, { as: StyledDrawerListContainer, container: { direction: 'column' }, "aria-labelledby": headerId, children: content })] }) }));
+            }, onOuterClick: () => setDrawerOpen(false), ref: drawerRef, children: [_jsxs(Flex, { as: StyledDrawerHeading, container: { alignItems: 'center' }, children: [_jsx(BareButton, { as: StyledDrawerBackButton, ref: backButtonRef, onClick: () => setDrawerOpen(false), "aria-label": t('close_noun', [header]), children: _jsx(Icon, { name: `arrow-${start}` }) }), _jsx(Text, { variant: 'h2', id: headerId, children: header })] }), _jsx(Flex, { as: StyledDrawerListContainer, container: { direction: 'column' }, "aria-labelledby": headerId, children: content })] }) }));
 };
 //# sourceMappingURL=Drawer.js.map

package/lib/components/AppShell/Drawer.js.map

@@ -1 +1 @@
-{"version":3,"file":"Drawer.js","sourceRoot":"","sources":["../../../src/components/AppShell/Drawer.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useContext, useRef } from 'react';\nimport type { ReactNode } from 'react';\n\nimport BareButton from '../Button/BareButton';\nimport Drawer from '../Drawer';\nimport Flex from '../Flex';\nimport Icon, { registerIcon } from '../Icon';\nimport * as arrowLeftIcon from '../Icon/icons/arrow-left.icon';\nimport Text from '../Text';\nimport {\n  useConsolidatedRef,\n  useDirection,\n  useElement,\n  useEscape,\n  useFocusTrap,\n  useI18n,\n  useTheme,\n  useUID\n} from '../../hooks';\nimport Configuration from '../Configuration/Configuration';\n\nimport AppShellContext from './AppShellContext';\nimport {\n  StyledDrawerWrapper,\n  StyledDrawerBackButton,\n  StyledDrawerHeading,\n  StyledDrawerListContainer\n} from './Drawer.styles';\nimport { navContrastColors } from './style-utils';\n\nregisterIcon(arrowLeftIcon);\n\ninterface DrawerViewProps {\n  content: ReactNode;\n  header: string;\n  onDrawerOpen?: () => void;\n  onDrawerClose?: () => void;\n  drawerOpen: boolean;\n  setDrawerOpen: (open: boolean) => void;\n}\n\nexport default ({\n  content,\n  header,\n  onDrawerOpen,\n  onDrawerClose,\n  drawerOpen,\n  setDrawerOpen\n}: DrawerViewProps) => {\n  const t = useI18n();\n  const theme = useTheme();\n  const { focusedImperatively } = useContext(AppShellContext);\n  const { ltr, rtl } = useDirection();\n  const returnFocusRef = useRef<HTMLElement>();\n  const [drawerEl, setDrawerEl] = useElement<HTMLDivElement>();\n  const drawerRef = useConsolidatedRef(setDrawerEl);\n  const backButtonRef = useRef<HTMLButtonElement>(null);\n  const headerId = useUID();\n\n  useEscape(\n    () => {\n      setDrawerOpen(false);\n    },\n    drawerEl,\n    [drawerEl]\n  );\n\n  useFocusTrap(drawerRef);\n\n  const { foreground, interactive } = navContrastColors(theme);\n  const navTheme = {\n    base: {\n      palette: {\n        'primary-background': theme.components['app-shell'].nav['background-color'],\n        'foreground-color': foreground,\n        interactive\n      }\n    }\n  };\n\n  return (\n    <Configuration theme={navTheme} portalTarget={drawerEl ?? undefined}>\n      <Drawer\n        role='dialog'\n        aria-labelledby={headerId}\n        as={StyledDrawerWrapper}\n        position='fixed'\n        placement='left'\n        open={drawerOpen}\n        nullWhenClosed\n        onBeforeOpen={() => {\n          returnFocusRef.current = (document.activeElement as HTMLElement) ?? undefined;\n        }}\n        onAfterOpen={() => {\n          if (backButtonRef.current && document.activeElement !== backButtonRef.current) {\n            focusedImperatively.current = true;\n            backButtonRef.current.focus();\n          }\n          onDrawerOpen?.();\n        }}\n        onAfterClose={() => {\n          onDrawerClose?.();\n          returnFocusRef.current?.focus();\n        }}\n        onOuterClick={() => setDrawerOpen(false)}\n        ref={drawerRef}\n      >\n        <Flex as={StyledDrawerHeading} container={{ alignItems: 'center' }}>\n          {rtl && (\n            <Text variant='h2' id={headerId}>\n              {header}\n            </Text>\n          )}\n          <BareButton\n            as={StyledDrawerBackButton}\n            ref={backButtonRef}\n            onClick={() => setDrawerOpen(false)}\n            aria-label={t('close_noun', [header])}\n          >\n            <Icon name='arrow-left' />\n          </BareButton>\n          {ltr && (\n            <Text variant='h2' id={headerId}>\n              {header}\n            </Text>\n          )}\n        </Flex>\n        <Flex\n          as={StyledDrawerListContainer}\n          container={{ direction: 'column' }}\n          aria-labelledby={headerId}\n        >\n          {content}\n        </Flex>\n      </Drawer>\n    </Configuration>\n  );\n};\n"]}
+{"version":3,"file":"Drawer.js","sourceRoot":"","sources":["../../../src/components/AppShell/Drawer.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useContext, useRef } from 'react';\nimport type { ReactNode } from 'react';\n\nimport BareButton from '../Button/BareButton';\nimport Drawer from '../Drawer';\nimport Flex from '../Flex';\nimport Icon, { registerIcon } from '../Icon';\nimport * as arrowLeftIcon from '../Icon/icons/arrow-left.icon';\nimport Text from '../Text';\nimport {\n  useConsolidatedRef,\n  useDirection,\n  useElement,\n  useEscape,\n  useFocusTrap,\n  useI18n,\n  useTheme,\n  useUID\n} from '../../hooks';\nimport Configuration from '../Configuration/Configuration';\n\nimport AppShellContext from './AppShellContext';\nimport {\n  StyledDrawerWrapper,\n  StyledDrawerBackButton,\n  StyledDrawerHeading,\n  StyledDrawerListContainer\n} from './Drawer.styles';\nimport { navContrastColors } from './style-utils';\n\nregisterIcon(arrowLeftIcon);\n\ninterface DrawerViewProps {\n  content: ReactNode;\n  header: string;\n  onDrawerOpen?: () => void;\n  onDrawerClose?: () => void;\n  drawerOpen: boolean;\n  setDrawerOpen: (open: boolean) => void;\n}\n\nexport default ({\n  content,\n  header,\n  onDrawerOpen,\n  onDrawerClose,\n  drawerOpen,\n  setDrawerOpen\n}: DrawerViewProps) => {\n  const t = useI18n();\n  const theme = useTheme();\n  const { focusedImperatively } = useContext(AppShellContext);\n  const { start } = useDirection();\n  const returnFocusRef = useRef<HTMLElement>();\n  const [drawerEl, setDrawerEl] = useElement<HTMLDivElement>();\n  const drawerRef = useConsolidatedRef(setDrawerEl);\n  const backButtonRef = useRef<HTMLButtonElement>(null);\n  const headerId = useUID();\n\n  useEscape(\n    () => {\n      setDrawerOpen(false);\n    },\n    drawerEl,\n    [drawerEl]\n  );\n\n  useFocusTrap(drawerRef);\n\n  const { foreground, interactive } = navContrastColors(theme);\n  const navTheme = {\n    base: {\n      palette: {\n        'primary-background': theme.components['app-shell'].nav['background-color'],\n        'foreground-color': foreground,\n        interactive\n      }\n    }\n  };\n\n  return (\n    <Configuration theme={navTheme} portalTarget={drawerEl ?? undefined}>\n      <Drawer\n        role='dialog'\n        aria-labelledby={headerId}\n        as={StyledDrawerWrapper}\n        position='fixed'\n        placement={start}\n        open={drawerOpen}\n        nullWhenClosed\n        onBeforeOpen={() => {\n          returnFocusRef.current = (document.activeElement as HTMLElement) ?? undefined;\n        }}\n        onAfterOpen={() => {\n          if (backButtonRef.current && document.activeElement !== backButtonRef.current) {\n            focusedImperatively.current = true;\n            backButtonRef.current.focus();\n          }\n          onDrawerOpen?.();\n        }}\n        onAfterClose={() => {\n          onDrawerClose?.();\n          returnFocusRef.current?.focus();\n        }}\n        onOuterClick={() => setDrawerOpen(false)}\n        ref={drawerRef}\n      >\n        <Flex as={StyledDrawerHeading} container={{ alignItems: 'center' }}>\n          <BareButton\n            as={StyledDrawerBackButton}\n            ref={backButtonRef}\n            onClick={() => setDrawerOpen(false)}\n            aria-label={t('close_noun', [header])}\n          >\n            <Icon name={`arrow-${start}`} />\n          </BareButton>\n          <Text variant='h2' id={headerId}>\n            {header}\n          </Text>\n        </Flex>\n        <Flex\n          as={StyledDrawerListContainer}\n          container={{ direction: 'column' }}\n          aria-labelledby={headerId}\n        >\n          {content}\n        </Flex>\n      </Drawer>\n    </Configuration>\n  );\n};\n"]}

package/lib/components/Badges/Keyboard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Keyboard.d.ts","sourceRoot":"","sources":["../../../src/components/Badges/Keyboard.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,cAAc,EAAc,cAAc,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAkC1F,eAAO,MAAM,cAAc,yGA+B1B,CAAC;AAGF,MAAM,MAAM,aAAa,GAAG,cAAc,CACxC,KAAK,EACL,cAAc,GAAG,UAAU,GAAG;IAAE,OAAO,EAAE,MAAM,CAAA;CAAE,CAClD,CAAC;;;;AAEF,wBAkBE"}
+{"version":3,"file":"Keyboard.d.ts","sourceRoot":"","sources":["../../../src/components/Badges/Keyboard.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,cAAc,EAAc,cAAc,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AA0E1F,eAAO,MAAM,cAAc,yGA+B1B,CAAC;AAGF,MAAM,MAAM,aAAa,GAAG,cAAc,CACxC,KAAK,EACL,cAAc,GAAG,UAAU,GAAG;IAAE,OAAO,EAAE,MAAM,CAAA;CAAE,CAClD,CAAC;;;;AAEF,wBAkBE"}

package/lib/components/Badges/Keyboard.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef } from 'react';
 import styled, { css } from 'styled-components';
 import { defaultThemeProp } from '../../theme';
@@ -11,25 +11,25 @@ const osxKeyMapper = {
     Alt: '⌥',
     Option: '⌥',
     Control: '⌃',
-    Return: '↵',
-    Enter: '↵',
-    Delete: 'Del',
+    Return: (_jsxs(_Fragment, { children: [_jsx("span", { "aria-label": 'Return' }), _jsx("span", { "aria-hidden": 'true', children: "\u21B5" })] })),
+    Enter: (_jsxs(_Fragment, { children: [_jsx("span", { "aria-label": 'Enter' }), _jsx("span", { "aria-hidden": 'true', children: "\u21B5" })] })),
+    Delete: (_jsxs(_Fragment, { children: [_jsx("span", { "aria-label": 'Delete' }), _jsx("span", { "aria-hidden": 'true', children: "Del" })] })),
     CommandOrControl: '⌘'
 };
 const windowsKeyMapper = {
     Control: 'Ctrl',
     Alt: 'Alt',
     Option: 'Alt',
-    Meta: '⊞',
-    Command: '⊞',
+    Meta: (_jsxs(_Fragment, { children: [_jsx("span", { "aria-label": 'Windows' }), _jsx("span", { "aria-hidden": 'true', children: "\u229E" })] })),
+    Command: (_jsxs(_Fragment, { children: [_jsx("span", { "aria-label": 'Windows' }), _jsx("span", { "aria-hidden": 'true', children: "\u229E" })] })),
     Backspace: 'Backspace',
     CommandOrControl: 'Ctrl'
 };
 const generalKeyMapper = {
-    'Page up': 'Pg up',
-    'Page down': 'Pg dn',
+    'Page up': (_jsxs(_Fragment, { children: [_jsx("span", { "aria-label": 'Page up' }), _jsx("span", { "aria-hidden": 'true', children: "Pg up" })] })),
+    'Page down': (_jsxs(_Fragment, { children: [_jsx("span", { "aria-label": 'Page down' }), _jsx("span", { "aria-hidden": 'true', children: "Pg dn" })] })),
     Ins: 'Insert',
-    Shift: '⇧'
+    Shift: (_jsxs(_Fragment, { children: [_jsx("span", { "aria-label": 'Shift' }), _jsx("span", { "aria-hidden": 'true', children: "\u21E7" })] }))
 };
 export const StyledKeyboard = styled.kbd(({ theme: { base, components: { text: { primary }, badges: { keyboard } } } }) => {
     return css `
@@ -57,7 +57,7 @@ StyledKeyboard.defaultProps = defaultThemeProp;
 export default withTestIds(forwardRef(function Keyboard({ testId, keyName, ...restProps }, ref) {
     const { windows: isWindows } = useOS();
     const testIds = useTestIds(testId, getKeyboardTestIds);
-    return (_jsx(StyledKeyboard, { "data-testid": testIds.root, ...restProps, "aria-label": keyName, ref: ref, children: (isWindows && windowsKeyMapper[keyName]) ||
+    return (_jsx(StyledKeyboard, { "data-testid": testIds.root, ...restProps, ref: ref, children: (isWindows && windowsKeyMapper[keyName]) ||
             osxKeyMapper[keyName] ||
             generalKeyMapper[keyName] ||
             keyName }));

package/lib/components/Badges/Keyboard.js.map

@@ -1 +1 @@
-{"version":3,"file":"Keyboard.js","sourceRoot":"","sources":["../../../src/components/Badges/Keyboard.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,KAAK,MAAM,mBAAmB,CAAC;AAEtC,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE1C,OAAO,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAEvD,MAAM,YAAY,GAA8B;IAC9C,OAAO,EAAE,GAAG;IACZ,GAAG,EAAE,GAAG;IACR,MAAM,EAAE,GAAG;IACX,OAAO,EAAE,GAAG;IACZ,MAAM,EAAE,GAAG;IACX,KAAK,EAAE,GAAG;IACV,MAAM,EAAE,KAAK;IACb,gBAAgB,EAAE,GAAG;CACtB,CAAC;AAEF,MAAM,gBAAgB,GAA8B;IAClD,OAAO,EAAE,MAAM;IACf,GAAG,EAAE,KAAK;IACV,MAAM,EAAE,KAAK;IACb,IAAI,EAAE,GAAG;IACT,OAAO,EAAE,GAAG;IACZ,SAAS,EAAE,WAAW;IACtB,gBAAgB,EAAE,MAAM;CACzB,CAAC;AAEF,MAAM,gBAAgB,GAA8B;IAClD,SAAS,EAAE,OAAO;IAClB,WAAW,EAAE,OAAO;IACpB,GAAG,EAAE,QAAQ;IACb,KAAK,EAAE,GAAG;CACX,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CACtC,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EACJ,UAAU,EAAE,EACV,IAAI,EAAE,EAAE,OAAO,EAAE,EACjB,MAAM,EAAE,EAAE,QAAQ,EAAE,EACrB,EACF,EACF,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;0BACY,QAAQ,CAAC,kBAAkB,CAAC;eACvC,IAAI,CAAC,OAAO,CAAC,kBAAkB,CAAC;;;qBAG1B,IAAI,CAAC,aAAa,CAAC;qBACnB,OAAO,CAAC,aAAa,CAAC;;;;gCAIX,QAAQ,CAAC,cAAc,CAAC;4BAC5B,IAAI,CAAC,eAAe,CAAC;;;;;;;;KAQ5C,CAAC;AACJ,CAAC,CACF,CAAC;AACF,cAAc,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAO/C,eAAe,WAAW,CACxB,UAAU,CAA4D,SAAS,QAAQ,CACrF,EAAE,MAAM,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,EACjC,GAAG;IAEH,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,CAAC;IACvC,MAAM,OAAO,GAAG,UAAU,CAAC,MAAM,EAAE,kBAAkB,CAAC,CAAC;IAEvD,OAAO,CACL,KAAC,cAAc,mBAAc,OAAO,CAAC,IAAI,KAAM,SAAS,gBAAc,OAAO,EAAE,GAAG,EAAE,GAAG,YACpF,CAAC,SAAS,IAAI,gBAAgB,CAAC,OAAO,CAAC,CAAC;YACvC,YAAY,CAAC,OAAO,CAAC;YACrB,gBAAgB,CAAC,OAAO,CAAC;YACzB,OAAO,GACM,CAClB,CAAC;AACJ,CAAC,CAAC,EACF,kBAAkB,CACnB,CAAC","sourcesContent":["import { forwardRef } from 'react';\nimport type { PropsWithoutRef } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport useOS from '../../hooks/useOS';\nimport type { NoChildrenProp, RefElement, WithAttributes, TestIdProp } from '../../types';\nimport { useTestIds } from '../../hooks';\nimport { withTestIds } from '../../utils';\n\nimport { getKeyboardTestIds } from './Badges.test-ids';\n\nconst osxKeyMapper: { [key: string]: string } = {\n  Command: '⌘',\n  Alt: '⌥',\n  Option: '⌥',\n  Control: '⌃',\n  Return: '↵',\n  Enter: '↵',\n  Delete: 'Del',\n  CommandOrControl: '⌘'\n};\n\nconst windowsKeyMapper: { [key: string]: string } = {\n  Control: 'Ctrl',\n  Alt: 'Alt',\n  Option: 'Alt',\n  Meta: '⊞',\n  Command: '⊞',\n  Backspace: 'Backspace',\n  CommandOrControl: 'Ctrl'\n};\n\nconst generalKeyMapper: { [key: string]: string } = {\n  'Page up': 'Pg up',\n  'Page down': 'Pg dn',\n  Ins: 'Insert',\n  Shift: '⇧'\n};\n\nexport const StyledKeyboard = styled.kbd(\n  ({\n    theme: {\n      base,\n      components: {\n        text: { primary },\n        badges: { keyboard }\n      }\n    }\n  }) => {\n    return css`\n      background-color: ${keyboard['background-color']};\n      color: ${base.palette['foreground-color']};\n      display: inline-block;\n      position: relative;\n      font-family: ${base['font-family']};\n      font-weight: ${primary['font-weight']};\n      overflow: hidden;\n      white-space: nowrap;\n      padding: 0.125rem;\n      border: 0.0125rem solid ${keyboard['border-color']};\n      border-radius: calc(${base['border-radius']} / 4);\n      text-transform: capitalize;\n      text-align: center;\n      min-width: 1.25rem;\n      height: 1.25rem;\n      text-overflow: ellipsis;\n      line-height: 1rem;\n      inset-block-start: calc(1.25rem / 4 - 0.125rem);\n    `;\n  }\n);\nStyledKeyboard.defaultProps = defaultThemeProp;\n\nexport type KeyboardProps = WithAttributes<\n  'kbd',\n  NoChildrenProp & TestIdProp & { keyName: string }\n>;\n\nexport default withTestIds(\n  forwardRef<RefElement<KeyboardProps>, PropsWithoutRef<KeyboardProps>>(function Keyboard(\n    { testId, keyName, ...restProps },\n    ref\n  ) {\n    const { windows: isWindows } = useOS();\n    const testIds = useTestIds(testId, getKeyboardTestIds);\n\n    return (\n      <StyledKeyboard data-testid={testIds.root} {...restProps} aria-label={keyName} ref={ref}>\n        {(isWindows && windowsKeyMapper[keyName]) ||\n          osxKeyMapper[keyName] ||\n          generalKeyMapper[keyName] ||\n          keyName}\n      </StyledKeyboard>\n    );\n  }),\n  getKeyboardTestIds\n);\n"]}
+{"version":3,"file":"Keyboard.js","sourceRoot":"","sources":["../../../src/components/Badges/Keyboard.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,KAAK,MAAM,mBAAmB,CAAC;AAEtC,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE1C,OAAO,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAEvD,MAAM,YAAY,GAA4C;IAC5D,OAAO,EAAE,GAAG;IACZ,GAAG,EAAE,GAAG;IACR,MAAM,EAAE,GAAG;IACX,OAAO,EAAE,GAAG;IACZ,MAAM,EAAE,CACN,8BACE,6BAAiB,QAAQ,GAAG,EAC5B,8BAAkB,MAAM,uBAAS,IAChC,CACJ;IACD,KAAK,EAAE,CACL,8BACE,6BAAiB,OAAO,GAAG,EAC3B,8BAAkB,MAAM,uBAAS,IAChC,CACJ;IACD,MAAM,EAAE,CACN,8BACE,6BAAiB,QAAQ,GAAG,EAC5B,8BAAkB,MAAM,oBAAW,IAClC,CACJ;IACD,gBAAgB,EAAE,GAAG;CACtB,CAAC;AAEF,MAAM,gBAAgB,GAA4C;IAChE,OAAO,EAAE,MAAM;IACf,GAAG,EAAE,KAAK;IACV,MAAM,EAAE,KAAK;IACb,IAAI,EAAE,CACJ,8BACE,6BAAiB,SAAS,GAAG,EAC7B,8BAAkB,MAAM,uBAAS,IAChC,CACJ;IACD,OAAO,EAAE,CACP,8BACE,6BAAiB,SAAS,GAAG,EAC7B,8BAAkB,MAAM,uBAAS,IAChC,CACJ;IACD,SAAS,EAAE,WAAW;IACtB,gBAAgB,EAAE,MAAM;CACzB,CAAC;AAEF,MAAM,gBAAgB,GAA4C;IAChE,SAAS,EAAE,CACT,8BACE,6BAAiB,SAAS,GAAG,EAC7B,8BAAkB,MAAM,sBAAa,IACpC,CACJ;IACD,WAAW,EAAE,CACX,8BACE,6BAAiB,WAAW,GAAG,EAC/B,8BAAkB,MAAM,sBAAa,IACpC,CACJ;IACD,GAAG,EAAE,QAAQ;IACb,KAAK,EAAE,CACL,8BACE,6BAAiB,OAAO,GAAG,EAC3B,8BAAkB,MAAM,uBAAS,IAChC,CACJ;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CACtC,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EACJ,UAAU,EAAE,EACV,IAAI,EAAE,EAAE,OAAO,EAAE,EACjB,MAAM,EAAE,EAAE,QAAQ,EAAE,EACrB,EACF,EACF,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;0BACY,QAAQ,CAAC,kBAAkB,CAAC;eACvC,IAAI,CAAC,OAAO,CAAC,kBAAkB,CAAC;;;qBAG1B,IAAI,CAAC,aAAa,CAAC;qBACnB,OAAO,CAAC,aAAa,CAAC;;;;gCAIX,QAAQ,CAAC,cAAc,CAAC;4BAC5B,IAAI,CAAC,eAAe,CAAC;;;;;;;;KAQ5C,CAAC;AACJ,CAAC,CACF,CAAC;AACF,cAAc,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAO/C,eAAe,WAAW,CACxB,UAAU,CAA4D,SAAS,QAAQ,CACrF,EAAE,MAAM,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,EACjC,GAAG;IAEH,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,CAAC;IACvC,MAAM,OAAO,GAAG,UAAU,CAAC,MAAM,EAAE,kBAAkB,CAAC,CAAC;IAEvD,OAAO,CACL,KAAC,cAAc,mBAAc,OAAO,CAAC,IAAI,KAAM,SAAS,EAAE,GAAG,EAAE,GAAG,YAC/D,CAAC,SAAS,IAAI,gBAAgB,CAAC,OAAO,CAAC,CAAC;YACvC,YAAY,CAAC,OAAO,CAAC;YACrB,gBAAgB,CAAC,OAAO,CAAC;YACzB,OAAO,GACM,CAClB,CAAC;AACJ,CAAC,CAAC,EACF,kBAAkB,CACnB,CAAC","sourcesContent":["import { forwardRef } from 'react';\nimport type { PropsWithoutRef } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport useOS from '../../hooks/useOS';\nimport type { NoChildrenProp, RefElement, WithAttributes, TestIdProp } from '../../types';\nimport { useTestIds } from '../../hooks';\nimport { withTestIds } from '../../utils';\n\nimport { getKeyboardTestIds } from './Badges.test-ids';\n\nconst osxKeyMapper: { [key: string]: string | JSX.Element } = {\n  Command: '⌘',\n  Alt: '⌥',\n  Option: '⌥',\n  Control: '⌃',\n  Return: (\n    <>\n      <span aria-label='Return' />\n      <span aria-hidden='true'>↵</span>\n    </>\n  ),\n  Enter: (\n    <>\n      <span aria-label='Enter' />\n      <span aria-hidden='true'>↵</span>\n    </>\n  ),\n  Delete: (\n    <>\n      <span aria-label='Delete' />\n      <span aria-hidden='true'>Del</span>\n    </>\n  ),\n  CommandOrControl: '⌘'\n};\n\nconst windowsKeyMapper: { [key: string]: string | JSX.Element } = {\n  Control: 'Ctrl',\n  Alt: 'Alt',\n  Option: 'Alt',\n  Meta: (\n    <>\n      <span aria-label='Windows' />\n      <span aria-hidden='true'>⊞</span>\n    </>\n  ),\n  Command: (\n    <>\n      <span aria-label='Windows' />\n      <span aria-hidden='true'>⊞</span>\n    </>\n  ),\n  Backspace: 'Backspace',\n  CommandOrControl: 'Ctrl'\n};\n\nconst generalKeyMapper: { [key: string]: string | JSX.Element } = {\n  'Page up': (\n    <>\n      <span aria-label='Page up' />\n      <span aria-hidden='true'>Pg up</span>\n    </>\n  ),\n  'Page down': (\n    <>\n      <span aria-label='Page down' />\n      <span aria-hidden='true'>Pg dn</span>\n    </>\n  ),\n  Ins: 'Insert',\n  Shift: (\n    <>\n      <span aria-label='Shift' />\n      <span aria-hidden='true'>⇧</span>\n    </>\n  )\n};\n\nexport const StyledKeyboard = styled.kbd(\n  ({\n    theme: {\n      base,\n      components: {\n        text: { primary },\n        badges: { keyboard }\n      }\n    }\n  }) => {\n    return css`\n      background-color: ${keyboard['background-color']};\n      color: ${base.palette['foreground-color']};\n      display: inline-block;\n      position: relative;\n      font-family: ${base['font-family']};\n      font-weight: ${primary['font-weight']};\n      overflow: hidden;\n      white-space: nowrap;\n      padding: 0.125rem;\n      border: 0.0125rem solid ${keyboard['border-color']};\n      border-radius: calc(${base['border-radius']} / 4);\n      text-transform: capitalize;\n      text-align: center;\n      min-width: 1.25rem;\n      height: 1.25rem;\n      text-overflow: ellipsis;\n      line-height: 1rem;\n      inset-block-start: calc(1.25rem / 4 - 0.125rem);\n    `;\n  }\n);\nStyledKeyboard.defaultProps = defaultThemeProp;\n\nexport type KeyboardProps = WithAttributes<\n  'kbd',\n  NoChildrenProp & TestIdProp & { keyName: string }\n>;\n\nexport default withTestIds(\n  forwardRef<RefElement<KeyboardProps>, PropsWithoutRef<KeyboardProps>>(function Keyboard(\n    { testId, keyName, ...restProps },\n    ref\n  ) {\n    const { windows: isWindows } = useOS();\n    const testIds = useTestIds(testId, getKeyboardTestIds);\n\n    return (\n      <StyledKeyboard data-testid={testIds.root} {...restProps} ref={ref}>\n        {(isWindows && windowsKeyMapper[keyName]) ||\n          osxKeyMapper[keyName] ||\n          generalKeyMapper[keyName] ||\n          keyName}\n      </StyledKeyboard>\n    );\n  }),\n  getKeyboardTestIds\n);\n"]}

package/lib/components/Badges/Status.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Status.d.ts","sourceRoot":"","sources":["../../../src/components/Badges/Status.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAmB,SAAS,EAAE,MAAM,OAAO,CAAC;AAMxD,OAAO,KAAK,EAAc,cAAc,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAO1E,MAAM,MAAM,WAAW,GAAG,cAAc,CACtC,MAAM,EACN,UAAU,GAAG;IACX,yFAAyF;IACzF,OAAO,EAAE,SAAS,GAAG,QAAQ,GAAG,MAAM,GAAG,SAAS,GAAG,MAAM,CAAC;IAC5D,0DAA0D;IAC1D,QAAQ,EAAE,SAAS,CAAC;CACrB,CACF,CAAC;AAEF,eAAO,MAAM,YAAY,oIAwBvB,CAAC;;;;AAIH,wBAeE"}
+{"version":3,"file":"Status.d.ts","sourceRoot":"","sources":["../../../src/components/Badges/Status.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAmB,SAAS,EAAE,MAAM,OAAO,CAAC;AAMxD,OAAO,KAAK,EAAc,cAAc,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAO1E,MAAM,MAAM,WAAW,GAAG,cAAc,CACtC,MAAM,EACN,UAAU,GAAG;IACX,yFAAyF;IACzF,OAAO,EAAE,SAAS,GAAG,QAAQ,GAAG,MAAM,GAAG,SAAS,GAAG,MAAM,CAAC;IAC5D,0DAA0D;IAC1D,QAAQ,EAAE,SAAS,CAAC;CACrB,CACF,CAAC;AAEF,eAAO,MAAM,YAAY,oIA0BvB,CAAC;;;;AAIH,wBAeE"}

package/lib/components/Badges/Status.js

@@ -16,6 +16,8 @@ export const StyledStatus = styled.span(props => {
     const shadow = tryCatch(() => rgba(foreground, 0.1));
     const fontSize = calculateFontSize(props.theme.base['font-size'], props.theme.base['font-scale']);
     return css `
+    display: inline-block;
+    position: relative;
     background-color: ${background};
     border-radius: calc(0.25 * ${borderRadius});
     color: ${foreground};

package/lib/components/Badges/Status.js.map

@@ -1 +1 @@
-{"version":3,"file":"Status.js","sourceRoot":"","sources":["../../../src/components/Badges/Status.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAEhC,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AACjD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE/C,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AACpD,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AACzC,OAAO,EAAE,wBAAwB,EAAE,MAAM,0CAA0C,CAAC;AAEpF,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAYrD,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,IAAI,CAA+B,KAAK,CAAC,EAAE;IAC5E,MAAM,EAAE,OAAO,EAAE,GAAG,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC;IACrC,MAAM,YAAY,GAAG,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;IACvD,MAAM,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC,KAAK,CAAC,UAAU,CAAC,MAAM,CAAC;IAEjD,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,GAAG,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;IACzD,MAAM,MAAM,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,UAAU,EAAE,GAAG,CAAC,CAAC,CAAC;IACrD,MAAM,QAAQ,GAAG,iBAAiB,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC;IAElG,OAAO,GAAG,CAAA;wBACY,UAAU;iCACD,YAAY;aAChC,UAAU;wCACiB,MAAM;;iBAE7B,QAAQ,CAAC,GAAG;;;2BAGF,OAAO;;;;;GAK/B,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,YAAY,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE7C,eAAe,WAAW,CACxB,UAAU,CAAwD,SAAS,MAAM,CAC/E,EAAE,MAAM,EAAE,OAAO,GAAG,MAAM,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,EACpD,GAAG;IAEH,MAAM,OAAO,GAAG,UAAU,CAAC,MAAM,EAAE,gBAAgB,CAAC,CAAC;IAErD,OAAO,CACL,MAAC,YAAY,mBAAc,OAAO,CAAC,IAAI,KAAM,SAAS,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,GAAG,aAChF,8CAAmB,QAAQ,GAAQ,EACnC,KAAC,wBAAwB,cAAE,QAAQ,GAA4B,IAClD,CAChB,CAAC;AACJ,CAAC,CAAC,EACF,gBAAgB,CACjB,CAAC","sourcesContent":["import { forwardRef } from 'react';\nimport type { PropsWithoutRef, ReactText } from 'react';\nimport styled, { css } from 'styled-components';\nimport { rgba } from 'polished';\n\nimport { calculateFontSize } from '../../styles';\nimport { defaultThemeProp } from '../../theme';\nimport type { RefElement, WithAttributes, TestIdProp } from '../../types';\nimport { tryCatch, withTestIds } from '../../utils';\nimport { useTestIds } from '../../hooks';\nimport { StyledVisuallyHiddenText } from '../VisuallyHiddenText/VisuallyHiddenText';\n\nimport { getStatusTestIds } from './Badges.test-ids';\n\nexport type StatusProps = WithAttributes<\n  'span',\n  TestIdProp & {\n    /** Determines the color to render the Badge as. This color is derived from the Theme. */\n    variant: 'success' | 'urgent' | 'warn' | 'pending' | 'info';\n    /** The content of the Badge, transformed to uppercase. */\n    children: ReactText;\n  }\n>;\n\nexport const StyledStatus = styled.span<Pick<StatusProps, 'variant'>>(props => {\n  const { spacing } = props.theme.base;\n  const borderRadius = props.theme.base['border-radius'];\n  const { status } = props.theme.components.badges;\n\n  const { background, foreground } = status[props.variant];\n  const shadow = tryCatch(() => rgba(foreground, 0.1));\n  const fontSize = calculateFontSize(props.theme.base['font-size'], props.theme.base['font-scale']);\n\n  return css`\n    background-color: ${background};\n    border-radius: calc(0.25 * ${borderRadius});\n    color: ${foreground};\n    box-shadow: inset 0 0 0 0.0625rem ${shadow};\n    display: inline-block;\n    font-size: ${fontSize.xxs};\n    font-weight: bold;\n    line-height: 1rem;\n    padding-inline: calc(${spacing} / 2);\n\n    & > :first-child {\n      text-transform: uppercase;\n    }\n  `;\n});\n\nStyledStatus.defaultProps = defaultThemeProp;\n\nexport default withTestIds(\n  forwardRef<RefElement<StatusProps>, PropsWithoutRef<StatusProps>>(function Status(\n    { testId, variant = 'info', children, ...restProps },\n    ref\n  ) {\n    const testIds = useTestIds(testId, getStatusTestIds);\n\n    return (\n      <StyledStatus data-testid={testIds.root} {...restProps} variant={variant} ref={ref}>\n        <span aria-hidden>{children}</span>\n        <StyledVisuallyHiddenText>{children}</StyledVisuallyHiddenText>\n      </StyledStatus>\n    );\n  }),\n  getStatusTestIds\n);\n"]}
+{"version":3,"file":"Status.js","sourceRoot":"","sources":["../../../src/components/Badges/Status.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAEhC,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AACjD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE/C,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AACpD,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AACzC,OAAO,EAAE,wBAAwB,EAAE,MAAM,0CAA0C,CAAC;AAEpF,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAYrD,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,IAAI,CAA+B,KAAK,CAAC,EAAE;IAC5E,MAAM,EAAE,OAAO,EAAE,GAAG,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC;IACrC,MAAM,YAAY,GAAG,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;IACvD,MAAM,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC,KAAK,CAAC,UAAU,CAAC,MAAM,CAAC;IAEjD,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,GAAG,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;IACzD,MAAM,MAAM,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,UAAU,EAAE,GAAG,CAAC,CAAC,CAAC;IACrD,MAAM,QAAQ,GAAG,iBAAiB,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC;IAElG,OAAO,GAAG,CAAA;;;wBAGY,UAAU;iCACD,YAAY;aAChC,UAAU;wCACiB,MAAM;;iBAE7B,QAAQ,CAAC,GAAG;;;2BAGF,OAAO;;;;;GAK/B,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,YAAY,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE7C,eAAe,WAAW,CACxB,UAAU,CAAwD,SAAS,MAAM,CAC/E,EAAE,MAAM,EAAE,OAAO,GAAG,MAAM,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,EACpD,GAAG;IAEH,MAAM,OAAO,GAAG,UAAU,CAAC,MAAM,EAAE,gBAAgB,CAAC,CAAC;IAErD,OAAO,CACL,MAAC,YAAY,mBAAc,OAAO,CAAC,IAAI,KAAM,SAAS,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,GAAG,aAChF,8CAAmB,QAAQ,GAAQ,EACnC,KAAC,wBAAwB,cAAE,QAAQ,GAA4B,IAClD,CAChB,CAAC;AACJ,CAAC,CAAC,EACF,gBAAgB,CACjB,CAAC","sourcesContent":["import { forwardRef } from 'react';\nimport type { PropsWithoutRef, ReactText } from 'react';\nimport styled, { css } from 'styled-components';\nimport { rgba } from 'polished';\n\nimport { calculateFontSize } from '../../styles';\nimport { defaultThemeProp } from '../../theme';\nimport type { RefElement, WithAttributes, TestIdProp } from '../../types';\nimport { tryCatch, withTestIds } from '../../utils';\nimport { useTestIds } from '../../hooks';\nimport { StyledVisuallyHiddenText } from '../VisuallyHiddenText/VisuallyHiddenText';\n\nimport { getStatusTestIds } from './Badges.test-ids';\n\nexport type StatusProps = WithAttributes<\n  'span',\n  TestIdProp & {\n    /** Determines the color to render the Badge as. This color is derived from the Theme. */\n    variant: 'success' | 'urgent' | 'warn' | 'pending' | 'info';\n    /** The content of the Badge, transformed to uppercase. */\n    children: ReactText;\n  }\n>;\n\nexport const StyledStatus = styled.span<Pick<StatusProps, 'variant'>>(props => {\n  const { spacing } = props.theme.base;\n  const borderRadius = props.theme.base['border-radius'];\n  const { status } = props.theme.components.badges;\n\n  const { background, foreground } = status[props.variant];\n  const shadow = tryCatch(() => rgba(foreground, 0.1));\n  const fontSize = calculateFontSize(props.theme.base['font-size'], props.theme.base['font-scale']);\n\n  return css`\n    display: inline-block;\n    position: relative;\n    background-color: ${background};\n    border-radius: calc(0.25 * ${borderRadius});\n    color: ${foreground};\n    box-shadow: inset 0 0 0 0.0625rem ${shadow};\n    display: inline-block;\n    font-size: ${fontSize.xxs};\n    font-weight: bold;\n    line-height: 1rem;\n    padding-inline: calc(${spacing} / 2);\n\n    & > :first-child {\n      text-transform: uppercase;\n    }\n  `;\n});\n\nStyledStatus.defaultProps = defaultThemeProp;\n\nexport default withTestIds(\n  forwardRef<RefElement<StatusProps>, PropsWithoutRef<StatusProps>>(function Status(\n    { testId, variant = 'info', children, ...restProps },\n    ref\n  ) {\n    const testIds = useTestIds(testId, getStatusTestIds);\n\n    return (\n      <StyledStatus data-testid={testIds.root} {...restProps} variant={variant} ref={ref}>\n        <span aria-hidden>{children}</span>\n        <StyledVisuallyHiddenText>{children}</StyledVisuallyHiddenText>\n      </StyledStatus>\n    );\n  }),\n  getStatusTestIds\n);\n"]}

package/lib/components/FieldGroup/FieldGroupList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FieldGroupList.d.ts","sourceRoot":"","sources":["../../../src/components/FieldGroup/FieldGroupList.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAmB,GAAG,EAAE,MAAM,OAAO,CAAC;AAGrE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAQhD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAIpD,MAAM,MAAM,uBAAuB,GAAG,eAAe,GAAG;IACtD,0CAA0C;IAC1C,EAAE,EAAE,MAAM,CAAC;IACX,oCAAoC;IACpC,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACjC,CAAC;AAEF,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,uBAAuB,EAAE,CAAC;IACjC,KAAK,CAAC,EAAE,MAAM,IAAI,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAeD,eAAO,MAAM,cAAc,qJAW1B,CAAC;AAaF,QAAA,MAAM,cAAc,EAAE,iBAAiB,CAAC,mBAAmB,GAAG,YAAY,CAsDzE,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"FieldGroupList.d.ts","sourceRoot":"","sources":["../../../src/components/FieldGroup/FieldGroupList.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAmB,GAAG,EAAE,MAAM,OAAO,CAAC;AAGrE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAQhD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAIpD,MAAM,MAAM,uBAAuB,GAAG,eAAe,GAAG;IACtD,0CAA0C;IAC1C,EAAE,EAAE,MAAM,CAAC;IACX,oCAAoC;IACpC,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACjC,CAAC;AAEF,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,uBAAuB,EAAE,CAAC;IACjC,KAAK,CAAC,EAAE,MAAM,IAAI,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAeD,eAAO,MAAM,cAAc,qJAc1B,CAAC;AAaF,QAAA,MAAM,cAAc,EAAE,iBAAiB,CAAC,mBAAmB,GAAG,YAAY,CAsDzE,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/lib/components/FieldGroup/FieldGroupList.js

@@ -18,8 +18,11 @@ const StyledFieldGroupList = styled.div(({ theme }) => css `
 StyledFieldGroupList.defaultProps = defaultThemeProp;
 export const StyledListItem = styled(FieldGroup)(({ theme }) => css `
       padding: ${theme.base.spacing} 0 calc(2 * ${theme.base.spacing});
-      border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};
-      margin-block-end: calc(2 * ${theme.base.spacing});
+
+      &:not(:last-of-type) {
+        border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};
+        margin-block-end: calc(2 * ${theme.base.spacing});
+      }
 
       legend {
         margin-block-end: 0;

package/lib/components/FieldGroup/FieldGroupList.js.map

@@ -1 +1 @@
-{"version":3,"file":"FieldGroupList.js","sourceRoot":"","sources":["../../../src/components/FieldGroup/FieldGroupList.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef } from 'react';\nimport type { FunctionComponent, PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport type { ForwardProps } from '../../types';\nimport Button from '../Button';\nimport Icon, { registerIcon } from '../Icon';\nimport * as plusIcon from '../Icon/icons/plus.icon';\nimport { useI18n } from '../../hooks';\nimport { defaultThemeProp } from '../../theme';\n\nimport FieldGroup, { StyledFieldGroup } from './FieldGroup';\nimport type { FieldGroupProps } from './FieldGroup';\n\nregisterIcon(plusIcon);\n\nexport type FieldGroupListItemProps = FieldGroupProps & {\n  /** The ID of the field group list item */\n  id: string;\n  /** Item level onDelete callback. */\n  onDelete?: (id: string) => void;\n};\n\nexport interface FieldGroupListProps {\n  items: FieldGroupListItemProps[];\n  onAdd?: () => void;\n  onDelete?: (id: string) => void;\n  ref?: Ref<HTMLDivElement>;\n}\n\nconst StyledFieldGroupList = styled.div(\n  ({ theme }) =>\n    css`\n      margin-block-start: ${theme.base.spacing};\n\n      ${StyledFieldGroup} {\n        margin-block-start: 0;\n      }\n    `\n);\n\nStyledFieldGroupList.defaultProps = defaultThemeProp;\n\nexport const StyledListItem = styled(FieldGroup)(\n  ({ theme }) =>\n    css`\n      padding: ${theme.base.spacing} 0 calc(2 * ${theme.base.spacing});\n      border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};\n      margin-block-end: calc(2 * ${theme.base.spacing});\n\n      legend {\n        margin-block-end: 0;\n      }\n    `\n);\n\nStyledListItem.defaultProps = defaultThemeProp;\n\nconst StyledAddButton = styled(Button)(\n  ({ theme }) =>\n    css`\n      margin-top: ${theme.base.spacing};\n    `\n);\n\nStyledAddButton.defaultProps = defaultThemeProp;\n\nconst FieldGroupList: FunctionComponent<FieldGroupListProps & ForwardProps> = forwardRef(\n  function FieldGroupList(\n    { items, onAdd, onDelete, ...restProps }: PropsWithoutRef<FieldGroupListProps>,\n    ref: FieldGroupListProps['ref']\n  ) {\n    const t = useI18n();\n\n    return (\n      <StyledFieldGroupList ref={ref} {...restProps}>\n        {items.map(\n          ({\n            id,\n            children,\n            name,\n            headingTag,\n            onDelete: itemOnDelete,\n            ...restItemProps\n          }: FieldGroupListItemProps) => {\n            return (\n              <StyledListItem\n                key={id}\n                name={name}\n                headingTag={headingTag}\n                {...restItemProps}\n                actions={\n                  onDelete || itemOnDelete\n                    ? [\n                        {\n                          id: 'delete',\n                          text: t('delete'),\n                          icon: 'trash',\n                          iconOnly: true,\n                          onClick: () => {\n                            itemOnDelete?.(id);\n                            onDelete?.(id);\n                          }\n                        }\n                      ]\n                    : undefined\n                }\n              >\n                {children}\n              </StyledListItem>\n            );\n          }\n        )}\n        {onAdd && (\n          <StyledAddButton variant='link' onClick={onAdd}>\n            <Icon name='plus' /> {t('add')}\n          </StyledAddButton>\n        )}\n      </StyledFieldGroupList>\n    );\n  }\n);\n\nexport default FieldGroupList;\n"]}
+{"version":3,"file":"FieldGroupList.js","sourceRoot":"","sources":["../../../src/components/FieldGroup/FieldGroupList.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef } from 'react';\nimport type { FunctionComponent, PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport type { ForwardProps } from '../../types';\nimport Button from '../Button';\nimport Icon, { registerIcon } from '../Icon';\nimport * as plusIcon from '../Icon/icons/plus.icon';\nimport { useI18n } from '../../hooks';\nimport { defaultThemeProp } from '../../theme';\n\nimport FieldGroup, { StyledFieldGroup } from './FieldGroup';\nimport type { FieldGroupProps } from './FieldGroup';\n\nregisterIcon(plusIcon);\n\nexport type FieldGroupListItemProps = FieldGroupProps & {\n  /** The ID of the field group list item */\n  id: string;\n  /** Item level onDelete callback. */\n  onDelete?: (id: string) => void;\n};\n\nexport interface FieldGroupListProps {\n  items: FieldGroupListItemProps[];\n  onAdd?: () => void;\n  onDelete?: (id: string) => void;\n  ref?: Ref<HTMLDivElement>;\n}\n\nconst StyledFieldGroupList = styled.div(\n  ({ theme }) =>\n    css`\n      margin-block-start: ${theme.base.spacing};\n\n      ${StyledFieldGroup} {\n        margin-block-start: 0;\n      }\n    `\n);\n\nStyledFieldGroupList.defaultProps = defaultThemeProp;\n\nexport const StyledListItem = styled(FieldGroup)(\n  ({ theme }) =>\n    css`\n      padding: ${theme.base.spacing} 0 calc(2 * ${theme.base.spacing});\n\n      &:not(:last-of-type) {\n        border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};\n        margin-block-end: calc(2 * ${theme.base.spacing});\n      }\n\n      legend {\n        margin-block-end: 0;\n      }\n    `\n);\n\nStyledListItem.defaultProps = defaultThemeProp;\n\nconst StyledAddButton = styled(Button)(\n  ({ theme }) =>\n    css`\n      margin-top: ${theme.base.spacing};\n    `\n);\n\nStyledAddButton.defaultProps = defaultThemeProp;\n\nconst FieldGroupList: FunctionComponent<FieldGroupListProps & ForwardProps> = forwardRef(\n  function FieldGroupList(\n    { items, onAdd, onDelete, ...restProps }: PropsWithoutRef<FieldGroupListProps>,\n    ref: FieldGroupListProps['ref']\n  ) {\n    const t = useI18n();\n\n    return (\n      <StyledFieldGroupList ref={ref} {...restProps}>\n        {items.map(\n          ({\n            id,\n            children,\n            name,\n            headingTag,\n            onDelete: itemOnDelete,\n            ...restItemProps\n          }: FieldGroupListItemProps) => {\n            return (\n              <StyledListItem\n                key={id}\n                name={name}\n                headingTag={headingTag}\n                {...restItemProps}\n                actions={\n                  onDelete || itemOnDelete\n                    ? [\n                        {\n                          id: 'delete',\n                          text: t('delete'),\n                          icon: 'trash',\n                          iconOnly: true,\n                          onClick: () => {\n                            itemOnDelete?.(id);\n                            onDelete?.(id);\n                          }\n                        }\n                      ]\n                    : undefined\n                }\n              >\n                {children}\n              </StyledListItem>\n            );\n          }\n        )}\n        {onAdd && (\n          <StyledAddButton variant='link' onClick={onAdd}>\n            <Icon name='plus' /> {t('add')}\n          </StyledAddButton>\n        )}\n      </StyledFieldGroupList>\n    );\n  }\n);\n\nexport default FieldGroupList;\n"]}

package/lib/components/ListToolbar/ListToolbar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ListToolbar.d.ts","sourceRoot":"","sources":["../../../src/components/ListToolbar/ListToolbar.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAA8C,MAAM,OAAO,CAAC;AAK3F,OAAO,KAAK,EAAU,YAAY,EAAE,MAAM,aAAa,CAAC;AAsCxD,OAAO,KAAK,EACV,gBAAgB,EAMjB,MAAM,qBAAqB,CAAC;;;;AAsa7B,wBAA+D"}
+{"version":3,"file":"ListToolbar.d.ts","sourceRoot":"","sources":["../../../src/components/ListToolbar/ListToolbar.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAA8C,MAAM,OAAO,CAAC;AAK3F,OAAO,KAAK,EAAU,YAAY,EAAE,MAAM,aAAa,CAAC;AAuCxD,OAAO,KAAK,EACV,gBAAgB,EAMjB,MAAM,qBAAqB,CAAC;;;;AA6a7B,wBAA+D"}

package/lib/components/ListToolbar/ListToolbar.js

@@ -18,7 +18,7 @@ import MenuButton from '../MenuButton';
 import Avatar from '../Avatar';
 import AdditionalInfo from '../AdditionalInfo';
 import PresetMenuPopover from './PresetMenuPopover';
-import { StyledViewSelector, StyledSearchForm, StyledListToolbar, StyledHeadingText, StyledCountMeta, StyledContainer, StyledListToolbarContent, StyledListToolbarDialog, StyledErrorIcon, StyledInfo } from './ListToolbar.styles';
+import { StyledViewSelector, StyledSearchForm, StyledListToolbar, StyledHeadingText, StyledCountMeta, StyledContainer, StyledListToolbarContent, StyledListToolbarDialog, StyledErrorIcon, StyledInfo, StyledSearchContainer } from './ListToolbar.styles';
 import helpers from './helpers';
 import { getListToolbarTestIds } from './ListToolbar.test-ids';
 registerIcon(filterIcon, arrowUpDownIcon, rowIcon, plusIcon, moreIcon);
@@ -45,11 +45,10 @@ const ListToolbar = forwardRef(function ListToolbar({ testId, name, headingTag =
     const uid = useUID();
     const t = useI18n();
     const testIds = useTestIds(testId, getListToolbarTestIds);
-    const isMediumOrAbove = useBreakpoint('md');
+    const isSmallOrAbove = useBreakpoint('sm');
     const consolidatedActionsButtonRef = useConsolidatedRef(actionsButtonRef);
     const toolbarContentRef = useRef(null);
     const searchInputRef = useRef(null);
-    const searchWrapperRef = useRef(null);
     const searchButtonRef = useRef(null);
     const [isSearchOpen, setIsSearchOpen] = useState(!!search?.value);
     const onSearchEscape = () => {
@@ -72,17 +71,21 @@ const ListToolbar = forwardRef(function ListToolbar({ testId, name, headingTag =
             return null;
         const text = createNew.label ?? t('create_new');
         return (_jsx(Button, { variant: 'simple', icon: true, label: text, "aria-label": text, onClick: createNew.onClick, children: _jsx(Icon, { name: 'plus' }) }));
-    }, [t, createNew, isMediumOrAbove]);
+    }, [t, createNew, isSmallOrAbove]);
     useEscape(onSearchEscape, searchInputRef);
-    const searchInputWrapper = useMemo(() => (_jsx("div", { role: 'dialog', ref: searchWrapperRef, children: _jsx(SearchInput, { ...search, onSearchSubmit: (value) => {
-                search?.onSearchSubmit?.(value);
-                onSearchEscape();
-            }, onClick: (e) => {
-                e.preventDefault();
-            }, ref: searchInputRef }) })), [search, onSearchEscape]);
+    const searchInput = useMemo(() => (_jsx(SearchInput, { ...search, onSearchSubmit: (value) => {
+            search?.onSearchSubmit?.(value);
+            onSearchEscape();
+        }, onClick: (e) => {
+            e.preventDefault();
+        }, onBlur: () => {
+            if (!search?.value) {
+                setIsSearchOpen(false);
+            }
+        }, ref: searchInputRef })), [search, onSearchEscape]);
     const searchLabel = t('search');
     const expandableSearch = useMemo(() => {
-        return isSearchOpen ? (searchInputWrapper) : (_jsx(Button, { variant: 'simple', icon: true, label: searchLabel, onClick: () => {
+        return isSearchOpen ? (searchInput) : (_jsx(Button, { variant: 'simple', icon: true, label: searchLabel, onClick: () => {
                 setIsSearchOpen(true);
                 setTimeout(() => searchInputRef.current?.focus());
             }, onKeyDown: (e) => {
@@ -94,7 +97,7 @@ const ListToolbar = forwardRef(function ListToolbar({ testId, name, headingTag =
                     });
                 }
             }, ref: searchButtonRef, children: _jsx(Icon, { name: 'search' }) }));
-    }, [searchLabel, setIsSearchOpen, isSearchOpen, searchInputWrapper]);
+    }, [searchLabel, setIsSearchOpen, isSearchOpen, searchInput]);
     let queryOptionPopover = null;
     if (currentQueryOptionId) {
         const queryOptionProps = { filter, sort, group }[currentQueryOptionId];
@@ -164,10 +167,13 @@ const ListToolbar = forwardRef(function ListToolbar({ testId, name, headingTag =
             labelText = `${name}: ${selectedViewName}`;
         }
     }
-    return (_jsxs(Flex, { "data-testid": testIds.root, container: true, ...restProps, as: StyledListToolbar, ref: ref, children: [_jsxs(StyledListToolbarContent, { container: { direction: 'column', gap: 0.5 }, ref: toolbarContentRef, item: { grow: 1 }, children: [_jsxs(Flex, { container: { alignItems: 'start', justify: 'between', gap: 2 }, children: [_jsxs(StyledContainer, { container: {
+    return (_jsxs(Flex, { "data-testid": testIds.root, container: true, ...restProps, as: StyledListToolbar, ref: ref, children: [_jsxs(StyledListToolbarContent, { container: { direction: 'column' }, ref: toolbarContentRef, item: { grow: 1 }, children: [_jsxs(Flex, { container: {
+                            alignItems: 'start',
+                            justify: 'between',
+                            gap: 0.5
+                        }, children: [_jsxs(StyledContainer, { container: {
                                     alignItems: 'center',
-                                    gap: 1,
-                                    wrap: 'wrap'
+                                    gap: 1
                                 }, children: [_jsxs(StyledHeadingText, { "data-testid": testIds.heading, variant: headingTag, required: formControlProps?.required, "aria-describedby": formControlProps?.info ? `${uid}-info` : undefined, children: [formControlProps?.info && formControlProps.status === 'error' && (_jsxs(_Fragment, { children: [_jsx(StyledErrorIcon, { name: 'warn-solid' }), _jsx(VisuallyHiddenText, { children: ` ${t('error')} ` })] })), !viewSelector || viewSelector.views.length <= 1 ? (labelText) : (_jsx(MenuButton, { variant: 'text', text: labelText, as: StyledViewSelector, menu: {
                                                     mode: 'single-select',
                                                     items: viewSelector.views.map(view => {
@@ -197,13 +203,13 @@ const ListToolbar = forwardRef(function ListToolbar({ testId, name, headingTag =
                                                         };
                                                     }),
                                                     onItemClick: viewSelector.onViewSelect
-                                                }, testId: testIds.viewSelector }))] }), formControlProps?.additionalInfo && (_jsx(AdditionalInfo, { heading: formControlProps.additionalInfo.heading, contextualLabel: labelText, children: formControlProps.additionalInfo.content })), isMediumOrAbove && count && _jsx(CountMeta, { "data-testid": testIds.count, count: count })] }), _jsxs(Flex, { container: { alignItems: 'center', gap: 1 }, children: [isMediumOrAbove && additionalActions, search && isMediumOrAbove && expandableSearch, isMediumOrAbove && createNewButton, isMediumOrAbove && basicModeActions && (_jsx("span", { children: _jsx(Actions, { items: basicModeActions.map(({ icon, ...restActionProps }) => ({
-                                                visual: icon ? _jsx(Icon, { name: icon }) : undefined,
-                                                ...restActionProps
-                                            })), menuAt: 1, ref: consolidatedActionsButtonRef }) })), !isMediumOrAbove && count && _jsx(CountMeta, { "data-testid": testIds.count, count: count })] })] }), !isMediumOrAbove && (_jsxs(Flex, { container: { alignItems: 'start', justify: 'between', gap: 1 }, children: [additionalActions, _jsx(Flex, { as: StyledSearchForm, container: { alignItems: 'center', wrap: 'wrap', gap: 1 }, item: { grow: 1 }, children: search && searchInputWrapper }), createNewButton, basicModeActions && (_jsx("span", { children: _jsx(Actions, { items: basicModeActions.map(({ icon, ...restActionProps }) => ({
-                                        visual: icon ? _jsx(Icon, { name: icon }) : undefined,
-                                        ...restActionProps
-                                    })), menuAt: 1, ref: consolidatedActionsButtonRef }) }))] })), formControlProps?.info && (_jsx(StyledInfo, { role: formControlProps.status === 'error' || formControlProps.status === 'warning'
+                                                }, testId: testIds.viewSelector }))] }), formControlProps?.additionalInfo && (_jsx(AdditionalInfo, { heading: formControlProps.additionalInfo.heading, contextualLabel: labelText, children: formControlProps.additionalInfo.content })), isSmallOrAbove && count && _jsx(CountMeta, { "data-testid": testIds.count, count: count })] }), _jsxs(Flex, { container: { alignItems: 'center', gap: 1 }, children: [isSmallOrAbove && additionalActions, search && isSmallOrAbove && expandableSearch, isSmallOrAbove && createNewButton, isSmallOrAbove && basicModeActions && (_jsx(Actions, { items: basicModeActions.map(({ icon, ...restActionProps }) => ({
+                                            ...restActionProps,
+                                            visual: icon && _jsx(Icon, { name: icon })
+                                        })), menuAt: 1, ref: consolidatedActionsButtonRef })), !isSmallOrAbove && count && _jsx(CountMeta, { "data-testid": testIds.count, count: count })] })] }), !isSmallOrAbove && (_jsxs(_Fragment, { children: [!!count?.selected && additionalActions, _jsxs(StyledSearchContainer, { container: { alignItems: 'start', justify: 'between', gap: 1 }, children: [_jsx(Flex, { as: StyledSearchForm, container: { alignItems: 'center', wrap: 'wrap', gap: 1 }, item: { grow: 1 }, children: search && searchInput }), createNewButton, basicModeActions && (_jsx(Actions, { items: basicModeActions.map(({ icon, ...restActionProps }) => ({
+                                            ...restActionProps,
+                                            visual: icon && _jsx(Icon, { name: icon })
+                                        })), menuAt: 1, ref: consolidatedActionsButtonRef }))] })] })), formControlProps?.info && (_jsx(StyledInfo, { role: formControlProps.status === 'error' || formControlProps.status === 'warning'
                             ? 'alert'
                             : undefined, id: `${uid}-info`, "data-testid": testIds.info, status: formControlProps.status, children: formControlProps.info }))] }), queryOptionPopover, _jsx(PresetMenuPopover, { buttonRef: consolidatedActionsButtonRef, heading: actionsQueryOptionPreset?.heading, menu: actionsQueryOptionPreset?.menu, isOpen: optionPresetMenuOpen, onClose: () => setOptionPresetMenuOpen(false) })] }));
 });

package/lib/components/ListToolbar/ListToolbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListToolbar.js","sourceRoot":"","sources":["../../../src/components/ListToolbar/ListToolbar.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport type { FunctionComponent, KeyboardEvent, PropsWithoutRef, MouseEvent } from 'react';\n\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport Actions from '../Actions';\nimport Button from '../Button';\nimport type { Action, ForwardProps } from '../../types';\nimport {\n  useBreakpoint,\n  useConfiguration,\n  useConsolidatedRef,\n  useEscape,\n  useI18n,\n  useTestIds,\n  useUID\n} from '../../hooks';\nimport Flex from '../Flex';\nimport SearchInput from '../SearchInput';\nimport Icon, { registerIcon } from '../Icon';\nimport * as filterIcon from '../Icon/icons/filter.icon';\nimport * as arrowUpDownIcon from '../Icon/icons/arrow-up-down.icon';\nimport * as rowIcon from '../Icon/icons/row.icon';\nimport * as plusIcon from '../Icon/icons/plus.icon';\nimport * as moreIcon from '../Icon/icons/more.icon';\nimport { hasProp, withTestIds } from '../../utils';\nimport { formatNumber } from '../Number';\nimport MenuButton from '../MenuButton';\nimport Avatar from '../Avatar';\nimport AdditionalInfo from '../AdditionalInfo';\n\nimport PresetMenuPopover from './PresetMenuPopover';\nimport type { PresetMenuPopoverProps } from './PresetMenuPopover';\nimport {\n  StyledViewSelector,\n  StyledSearchForm,\n  StyledListToolbar,\n  StyledHeadingText,\n  StyledCountMeta,\n  StyledContainer,\n  StyledListToolbarContent,\n  StyledListToolbarDialog,\n  StyledErrorIcon,\n  StyledInfo\n} from './ListToolbar.styles';\nimport type {\n  ListToolbarProps,\n  PresetMenuProps,\n  QueryOptionDialogProps,\n  QueryOptionId,\n  ViewProps,\n  ViewSelectorProps\n} from './ListToolbar.types';\nimport helpers from './helpers';\nimport { getListToolbarTestIds } from './ListToolbar.test-ids';\n\nregisterIcon(filterIcon, arrowUpDownIcon, rowIcon, plusIcon, moreIcon);\n\nconst CountMeta = ({\n  count,\n  ...restProps\n}: { count: NonNullable<ListToolbarProps['count']> } & ForwardProps) => {\n  const { locale } = useConfiguration();\n  const t = useI18n();\n  const totalFormattedValue = formatNumber(count.total ?? 0, {\n    locale,\n    options: {\n      useGrouping: true\n    }\n  });\n  return (\n    <StyledCountMeta variant='secondary' {...restProps}>\n      {count.selected\n        ? t(\n            'selected_count',\n            [formatNumber(count.selected, { locale, options: { useGrouping: true } })],\n            { count: count.selected }\n          )\n        : count.total !== undefined &&\n          t(\n            'results_count',\n            [count.totalHasMore ? `${totalFormattedValue}+` : totalFormattedValue],\n            {\n              count: count.total\n            }\n          )}\n    </StyledCountMeta>\n  );\n};\n\nconst generateViewName = (\n  view: ViewProps,\n  texts: { default: string; appDefault: string },\n  options: {\n    defaultId?: ViewSelectorProps['defaultId'];\n    appDefaultId?: ViewSelectorProps['appDefaultId'];\n  }\n) => {\n  return `${view.text} ${view.id === options.defaultId ? `(${texts.default})` : ''} ${\n    view.id === options.appDefaultId ? `(${texts.appDefault})` : ''\n  }`;\n};\n\nconst ListToolbar: FunctionComponent<ListToolbarProps & ForwardProps> = forwardRef(\n  function ListToolbar(\n    {\n      testId,\n      name,\n      headingTag = 'h3',\n      viewSelector,\n      formControlProps,\n      createNew,\n      search,\n      count,\n      additionalActions,\n      filter,\n      sort,\n      group,\n      actions,\n      actionsButtonRef,\n      ...restProps\n    }: PropsWithoutRef<ListToolbarProps>,\n    ref: ListToolbarProps['ref']\n  ) {\n    const uid = useUID();\n    const t = useI18n();\n    const testIds = useTestIds(testId, getListToolbarTestIds);\n\n    const isMediumOrAbove = useBreakpoint('md');\n    const consolidatedActionsButtonRef = useConsolidatedRef(actionsButtonRef);\n    const toolbarContentRef = useRef<HTMLDivElement>(null);\n    const searchInputRef = useRef<HTMLInputElement>(null);\n    const searchWrapperRef = useRef<HTMLDivElement>(null);\n    const searchButtonRef = useRef<HTMLButtonElement>(null);\n    const [isSearchOpen, setIsSearchOpen] = useState(!!search?.value);\n\n    const onSearchEscape = () => {\n      if (!search?.value) {\n        setIsSearchOpen(false);\n      }\n      setTimeout(() => searchButtonRef.current?.focus());\n    };\n\n    useEffect(() => {\n      if (search?.value) {\n        setIsSearchOpen(true);\n      }\n    }, [search?.value]);\n\n    const [currentQueryOptionId, setCurrentQueryOptionId] = useState<QueryOptionId | null>(null);\n    const queryOptionPopoverTarget = useRef<HTMLButtonElement>();\n\n    const [actionsQueryOptionPreset, setActionsQueryOptionPreset] =\n      useState<Pick<PresetMenuPopoverProps, 'heading' | 'menu'>>();\n    const [optionPresetMenuOpen, setOptionPresetMenuOpen] = useState(false);\n\n    const createNewButton = useMemo(() => {\n      if (!createNew?.onClick) return null;\n      const text = createNew.label ?? t('create_new');\n\n      return (\n        <Button variant='simple' icon label={text} aria-label={text} onClick={createNew.onClick}>\n          <Icon name='plus' />\n        </Button>\n      );\n    }, [t, createNew, isMediumOrAbove]);\n\n    useEscape(onSearchEscape, searchInputRef);\n    const searchInputWrapper = useMemo(\n      () => (\n        <div role='dialog' ref={searchWrapperRef}>\n          <SearchInput\n            {...search}\n            onSearchSubmit={(value: string) => {\n              search?.onSearchSubmit?.(value);\n              onSearchEscape();\n            }}\n            onClick={(e: MouseEvent<HTMLInputElement>) => {\n              e.preventDefault();\n            }}\n            ref={searchInputRef}\n          />\n        </div>\n      ),\n      [search, onSearchEscape]\n    );\n\n    const searchLabel = t('search');\n    const expandableSearch = useMemo(() => {\n      return isSearchOpen ? (\n        searchInputWrapper\n      ) : (\n        <Button\n          variant='simple'\n          icon\n          label={searchLabel}\n          onClick={() => {\n            setIsSearchOpen(true);\n            setTimeout(() => searchInputRef.current?.focus());\n          }}\n          onKeyDown={(e: KeyboardEvent<HTMLElement>) => {\n            if (e.target !== searchInputRef.current && (e.key === 'Enter' || e.key === ' ')) {\n              setIsSearchOpen(true);\n              setTimeout(() => {\n                searchInputRef.current?.focus();\n                searchInputRef.current?.select();\n              });\n            }\n          }}\n          ref={searchButtonRef}\n        >\n          <Icon name='search' />\n        </Button>\n      );\n    }, [searchLabel, setIsSearchOpen, isSearchOpen, searchInputWrapper]);\n\n    let queryOptionPopover = null;\n    if (currentQueryOptionId) {\n      const queryOptionProps = { filter, sort, group }[currentQueryOptionId];\n      if (\n        queryOptionProps &&\n        hasProp(queryOptionProps, 'renderer') &&\n        queryOptionPopoverTarget.current\n      ) {\n        queryOptionPopover = (\n          <StyledListToolbarDialog\n            target={queryOptionPopoverTarget.current}\n            heading={t(currentQueryOptionId)}\n            placement='bottom-end'\n            onCancel={() => {\n              if (queryOptionProps.onCancel() === false) return;\n              setCurrentQueryOptionId(null);\n            }}\n            onSubmit={() => {\n              if (queryOptionProps.onSubmit() === false) return;\n              setCurrentQueryOptionId(null);\n            }}\n          >\n            <queryOptionProps.renderer />\n          </StyledListToolbarDialog>\n        );\n      }\n    }\n\n    const getQueryOptionAction = useCallback(\n      (\n        id: 'sort' | 'group' | 'filter',\n        icon: string,\n        queryOptionProps: QueryOptionDialogProps | PresetMenuProps\n      ) => {\n        return {\n          text: t(id),\n          id,\n          icon,\n          count: queryOptionProps.count,\n          onClick: () => {\n            if (hasProp(queryOptionProps, 'renderer')) {\n              setCurrentQueryOptionId(id);\n              queryOptionPopoverTarget.current = consolidatedActionsButtonRef.current ?? undefined;\n            }\n            if (hasProp(queryOptionProps, 'items')) {\n              setActionsQueryOptionPreset({\n                heading: t(id),\n                menu: {\n                  mode: queryOptionProps.mode,\n                  items: queryOptionProps.items.map(item => ({ ...item, primary: item.text })),\n                  onItemClick: queryOptionProps.onItemClick\n                }\n              });\n              setOptionPresetMenuOpen(true);\n            }\n          }\n        };\n      },\n      []\n    );\n\n    const basicModeActions = useMemo(() => {\n      let basicActions: Action[] = [];\n      if (filter) {\n        const filterAction: Action = getQueryOptionAction('filter', 'filter', filter);\n        basicActions.push(filterAction);\n      }\n      if (sort) {\n        const sortAction: Action = getQueryOptionAction('sort', 'arrow-up-down', sort);\n        basicActions.push(sortAction);\n      }\n      if (group) {\n        const groupAction: Action = getQueryOptionAction('group', 'row', group);\n        basicActions.push(groupAction);\n      }\n      if (actions) {\n        basicActions = basicActions.concat(actions);\n      }\n\n      return basicActions.length ? basicActions : undefined;\n    }, [actions, filter, sort, group, getQueryOptionAction]);\n\n    let labelText = name;\n\n    if (viewSelector) {\n      const viewItems = helpers.getViews(viewSelector.views);\n\n      if (viewItems.length > 1) {\n        const selectedViewName =\n          helpers.getSelectedView(viewSelector.views)?.text ?? viewItems[0].text;\n\n        labelText = `${name}: ${selectedViewName}`;\n      }\n    }\n\n    return (\n      <Flex data-testid={testIds.root} container {...restProps} as={StyledListToolbar} ref={ref}>\n        <StyledListToolbarContent\n          container={{ direction: 'column', gap: 0.5 }}\n          ref={toolbarContentRef}\n          item={{ grow: 1 }}\n        >\n          <Flex container={{ alignItems: 'start', justify: 'between', gap: 2 }}>\n            <StyledContainer\n              container={{\n                alignItems: 'center',\n                gap: 1,\n                wrap: 'wrap'\n              }}\n            >\n              <StyledHeadingText\n                data-testid={testIds.heading}\n                variant={headingTag}\n                required={formControlProps?.required}\n                aria-describedby={formControlProps?.info ? `${uid}-info` : undefined}\n              >\n                {formControlProps?.info && formControlProps.status === 'error' && (\n                  <>\n                    <StyledErrorIcon name='warn-solid' />\n                    <VisuallyHiddenText>{` ${t('error')} `}</VisuallyHiddenText>\n                  </>\n                )}\n                {!viewSelector || viewSelector.views.length <= 1 ? (\n                  labelText\n                ) : (\n                  <MenuButton\n                    variant='text'\n                    text={labelText}\n                    as={StyledViewSelector}\n                    menu={{\n                      mode: 'single-select',\n                      items: viewSelector.views.map(view => {\n                        if (hasProp(view, 'items')) {\n                          return {\n                            id: view.text,\n                            label: view.text,\n                            items: view.items.map(groupedView => {\n                              return {\n                                ...groupedView,\n                                primary: generateViewName(\n                                  groupedView,\n                                  { default: t('default'), appDefault: t('app_default') },\n                                  {\n                                    defaultId: viewSelector.defaultId,\n                                    appDefaultId: viewSelector.appDefaultId\n                                  }\n                                ),\n                                visual: groupedView.visual ? (\n                                  <Avatar {...groupedView.visual} />\n                                ) : undefined\n                              };\n                            })\n                          };\n                        }\n\n                        return {\n                          ...view,\n                          primary: generateViewName(\n                            view,\n                            { default: t('default'), appDefault: t('app_default') },\n                            {\n                              defaultId: viewSelector.defaultId,\n                              appDefaultId: viewSelector.appDefaultId\n                            }\n                          ),\n                          visual: view.visual ? <Avatar {...view.visual} /> : undefined\n                        };\n                      }),\n                      onItemClick: viewSelector.onViewSelect\n                    }}\n                    testId={testIds.viewSelector}\n                  />\n                )}\n              </StyledHeadingText>\n              {formControlProps?.additionalInfo && (\n                <AdditionalInfo\n                  heading={formControlProps.additionalInfo.heading}\n                  contextualLabel={labelText}\n                >\n                  {formControlProps.additionalInfo.content}\n                </AdditionalInfo>\n              )}\n              {isMediumOrAbove && count && <CountMeta data-testid={testIds.count} count={count} />}\n            </StyledContainer>\n            <Flex container={{ alignItems: 'center', gap: 1 }}>\n              {isMediumOrAbove && additionalActions}\n              {search && isMediumOrAbove && expandableSearch}\n              {isMediumOrAbove && createNewButton}\n              {isMediumOrAbove && basicModeActions && (\n                <span>\n                  <Actions\n                    items={basicModeActions.map(({ icon, ...restActionProps }) => ({\n                      visual: icon ? <Icon name={icon} /> : undefined,\n                      ...restActionProps\n                    }))}\n                    menuAt={1}\n                    ref={consolidatedActionsButtonRef}\n                  />\n                </span>\n              )}\n              {!isMediumOrAbove && count && <CountMeta data-testid={testIds.count} count={count} />}\n            </Flex>\n          </Flex>\n          {!isMediumOrAbove && (\n            <Flex container={{ alignItems: 'start', justify: 'between', gap: 1 }}>\n              {additionalActions}\n              <Flex\n                as={StyledSearchForm}\n                container={{ alignItems: 'center', wrap: 'wrap', gap: 1 }}\n                item={{ grow: 1 }}\n              >\n                {search && searchInputWrapper}\n              </Flex>\n              {createNewButton}\n              {basicModeActions && (\n                <span>\n                  <Actions\n                    items={basicModeActions.map(({ icon, ...restActionProps }) => ({\n                      visual: icon ? <Icon name={icon} /> : undefined,\n                      ...restActionProps\n                    }))}\n                    menuAt={1}\n                    ref={consolidatedActionsButtonRef}\n                  />\n                </span>\n              )}\n            </Flex>\n          )}\n          {formControlProps?.info && (\n            <StyledInfo\n              role={\n                formControlProps.status === 'error' || formControlProps.status === 'warning'\n                  ? 'alert'\n                  : undefined\n              }\n              id={`${uid}-info`}\n              data-testid={testIds.info}\n              status={formControlProps.status}\n            >\n              {formControlProps.info}\n            </StyledInfo>\n          )}\n        </StyledListToolbarContent>\n\n        {queryOptionPopover}\n\n        <PresetMenuPopover\n          buttonRef={consolidatedActionsButtonRef}\n          heading={actionsQueryOptionPreset?.heading}\n          menu={actionsQueryOptionPreset?.menu}\n          isOpen={optionPresetMenuOpen}\n          onClose={() => setOptionPresetMenuOpen(false)}\n        />\n      </Flex>\n    );\n  }\n);\n\nexport default withTestIds(ListToolbar, getListToolbarTestIds);\n"]}
+{"version":3,"file":"ListToolbar.js","sourceRoot":"","sources":["../../../src/components/ListToolbar/ListToolbar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAGtF,OAAO,kBAAkB,MAAM,uBAAuB,CAAC;AACvD,OAAO,OAAO,MAAM,YAAY,CAAC;AACjC,OAAO,MAAM,MAAM,WAAW,CAAC;AAE/B,OAAO,EACL,aAAa,EACb,gBAAgB,EAChB,kBAAkB,EAClB,SAAS,EACT,OAAO,EACP,UAAU,EACV,MAAM,EACP,MAAM,aAAa,CAAC;AACrB,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,WAAW,MAAM,gBAAgB,CAAC;AACzC,OAAO,IAAI,EAAE,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAC7C,OAAO,KAAK,UAAU,MAAM,2BAA2B,CAAC;AACxD,OAAO,KAAK,eAAe,MAAM,kCAAkC,CAAC;AACpE,OAAO,KAAK,OAAO,MAAM,wBAAwB,CAAC;AAClD,OAAO,KAAK,QAAQ,MAAM,yBAAyB,CAAC;AACpD,OAAO,KAAK,QAAQ,MAAM,yBAAyB,CAAC;AACpD,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AACzC,OAAO,UAAU,MAAM,eAAe,CAAC;AACvC,OAAO,MAAM,MAAM,WAAW,CAAC;AAC/B,OAAO,cAAc,MAAM,mBAAmB,CAAC;AAE/C,OAAO,iBAAiB,MAAM,qBAAqB,CAAC;AAEpD,OAAO,EACL,kBAAkB,EAClB,gBAAgB,EAChB,iBAAiB,EACjB,iBAAiB,EACjB,eAAe,EACf,eAAe,EACf,wBAAwB,EACxB,uBAAuB,EACvB,eAAe,EACf,UAAU,EACV,qBAAqB,EACtB,MAAM,sBAAsB,CAAC;AAS9B,OAAO,OAAO,MAAM,WAAW,CAAC;AAChC,OAAO,EAAE,qBAAqB,EAAE,MAAM,wBAAwB,CAAC;AAE/D,YAAY,CAAC,UAAU,EAAE,eAAe,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC;AAEvE,MAAM,SAAS,GAAG,CAAC,EACjB,KAAK,EACL,GAAG,SAAS,EACqD,EAAE,EAAE;IACrE,MAAM,EAAE,MAAM,EAAE,GAAG,gBAAgB,EAAE,CAAC;IACtC,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,mBAAmB,GAAG,YAAY,CAAC,KAAK,CAAC,KAAK,IAAI,CAAC,EAAE;QACzD,MAAM;QACN,OAAO,EAAE;YACP,WAAW,EAAE,IAAI;SAClB;KACF,CAAC,CAAC;IACH,OAAO,CACL,KAAC,eAAe,IAAC,OAAO,EAAC,WAAW,KAAK,SAAS,YAC/C,KAAK,CAAC,QAAQ;YACb,CAAC,CAAC,CAAC,CACC,gBAAgB,EAChB,CAAC,YAAY,CAAC,KAAK,CAAC,QAAQ,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,WAAW,EAAE,IAAI,EAAE,EAAE,CAAC,CAAC,EAC1E,EAAE,KAAK,EAAE,KAAK,CAAC,QAAQ,EAAE,CAC1B;YACH,CAAC,CAAC,KAAK,CAAC,KAAK,KAAK,SAAS;gBACzB,CAAC,CACC,eAAe,EACf,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC,GAAG,mBAAmB,GAAG,CAAC,CAAC,CAAC,mBAAmB,CAAC,EACtE;oBACE,KAAK,EAAE,KAAK,CAAC,KAAK;iBACnB,CACF,GACW,CACnB,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,gBAAgB,GAAG,CACvB,IAAe,EACf,KAA8C,EAC9C,OAGC,EACD,EAAE;IACF,OAAO,GAAG,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,EAAE,KAAK,OAAO,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,KAAK,CAAC,OAAO,GAAG,CAAC,CAAC,CAAC,EAAE,IAC9E,IAAI,CAAC,EAAE,KAAK,OAAO,CAAC,YAAY,CAAC,CAAC,CAAC,IAAI,KAAK,CAAC,UAAU,GAAG,CAAC,CAAC,CAAC,EAC/D,EAAE,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,WAAW,GAAuD,UAAU,CAChF,SAAS,WAAW,CAClB,EACE,MAAM,EACN,IAAI,EACJ,UAAU,GAAG,IAAI,EACjB,YAAY,EACZ,gBAAgB,EAChB,SAAS,EACT,MAAM,EACN,KAAK,EACL,iBAAiB,EACjB,MAAM,EACN,IAAI,EACJ,KAAK,EACL,OAAO,EACP,gBAAgB,EAChB,GAAG,SAAS,EACsB,EACpC,GAA4B;IAE5B,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;IACrB,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,OAAO,GAAG,UAAU,CAAC,MAAM,EAAE,qBAAqB,CAAC,CAAC;IAE1D,MAAM,cAAc,GAAG,aAAa,CAAC,IAAI,CAAC,CAAC;IAC3C,MAAM,4BAA4B,GAAG,kBAAkB,CAAC,gBAAgB,CAAC,CAAC;IAC1E,MAAM,iBAAiB,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACvD,MAAM,cAAc,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IACtD,MAAM,eAAe,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IACxD,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;IAElE,MAAM,cAAc,GAAG,GAAG,EAAE;QAC1B,IAAI,CAAC,MAAM,EAAE,KAAK,EAAE;YAClB,eAAe,CAAC,KAAK,CAAC,CAAC;SACxB;QACD,UAAU,CAAC,GAAG,EAAE,CAAC,eAAe,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC,CAAC;IACrD,CAAC,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,MAAM,EAAE,KAAK,EAAE;YACjB,eAAe,CAAC,IAAI,CAAC,CAAC;SACvB;IACH,CAAC,EAAE,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC,CAAC;IAEpB,MAAM,CAAC,oBAAoB,EAAE,uBAAuB,CAAC,GAAG,QAAQ,CAAuB,IAAI,CAAC,CAAC;IAC7F,MAAM,wBAAwB,GAAG,MAAM,EAAqB,CAAC;IAE7D,MAAM,CAAC,wBAAwB,EAAE,2BAA2B,CAAC,GAC3D,QAAQ,EAAoD,CAAC;IAC/D,MAAM,CAAC,oBAAoB,EAAE,uBAAuB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAExE,MAAM,eAAe,GAAG,OAAO,CAAC,GAAG,EAAE;QACnC,IAAI,CAAC,SAAS,EAAE,OAAO;YAAE,OAAO,IAAI,CAAC;QACrC,MAAM,IAAI,GAAG,SAAS,CAAC,KAAK,IAAI,CAAC,CAAC,YAAY,CAAC,CAAC;QAEhD,OAAO,CACL,KAAC,MAAM,IAAC,OAAO,EAAC,QAAQ,EAAC,IAAI,QAAC,KAAK,EAAE,IAAI,gBAAc,IAAI,EAAE,OAAO,EAAE,SAAS,CAAC,OAAO,YACrF,KAAC,IAAI,IAAC,IAAI,EAAC,MAAM,GAAG,GACb,CACV,CAAC;IACJ,CAAC,EAAE,CAAC,CAAC,EAAE,SAAS,EAAE,cAAc,CAAC,CAAC,CAAC;IAEnC,SAAS,CAAC,cAAc,EAAE,cAAc,CAAC,CAAC;IAC1C,MAAM,WAAW,GAAG,OAAO,CACzB,GAAG,EAAE,CAAC,CACJ,KAAC,WAAW,OACN,MAAM,EACV,cAAc,EAAE,CAAC,KAAa,EAAE,EAAE;YAChC,MAAM,EAAE,cAAc,EAAE,CAAC,KAAK,CAAC,CAAC;YAChC,cAAc,EAAE,CAAC;QACnB,CAAC,EACD,OAAO,EAAE,CAAC,CAA+B,EAAE,EAAE;YAC3C,CAAC,CAAC,cAAc,EAAE,CAAC;QACrB,CAAC,EACD,MAAM,EAAE,GAAG,EAAE;YACX,IAAI,CAAC,MAAM,EAAE,KAAK,EAAE;gBAClB,eAAe,CAAC,KAAK,CAAC,CAAC;aACxB;QACH,CAAC,EACD,GAAG,EAAE,cAAc,GACnB,CACH,EACD,CAAC,MAAM,EAAE,cAAc,CAAC,CACzB,CAAC;IAEF,MAAM,WAAW,GAAG,CAAC,CAAC,QAAQ,CAAC,CAAC;IAChC,MAAM,gBAAgB,GAAG,OAAO,CAAC,GAAG,EAAE;QACpC,OAAO,YAAY,CAAC,CAAC,CAAC,CACpB,WAAW,CACZ,CAAC,CAAC,CAAC,CACF,KAAC,MAAM,IACL,OAAO,EAAC,QAAQ,EAChB,IAAI,QACJ,KAAK,EAAE,WAAW,EAClB,OAAO,EAAE,GAAG,EAAE;gBACZ,eAAe,CAAC,IAAI,CAAC,CAAC;gBACtB,UAAU,CAAC,GAAG,EAAE,CAAC,cAAc,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC,CAAC;YACpD,CAAC,EACD,SAAS,EAAE,CAAC,CAA6B,EAAE,EAAE;gBAC3C,IAAI,CAAC,CAAC,MAAM,KAAK,cAAc,CAAC,OAAO,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,OAAO,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,EAAE;oBAC/E,eAAe,CAAC,IAAI,CAAC,CAAC;oBACtB,UAAU,CAAC,GAAG,EAAE;wBACd,cAAc,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;wBAChC,cAAc,CAAC,OAAO,EAAE,MAAM,EAAE,CAAC;oBACnC,CAAC,CAAC,CAAC;iBACJ;YACH,CAAC,EACD,GAAG,EAAE,eAAe,YAEpB,KAAC,IAAI,IAAC,IAAI,EAAC,QAAQ,GAAG,GACf,CACV,CAAC;IACJ,CAAC,EAAE,CAAC,WAAW,EAAE,eAAe,EAAE,YAAY,EAAE,WAAW,CAAC,CAAC,CAAC;IAE9D,IAAI,kBAAkB,GAAG,IAAI,CAAC;IAC9B,IAAI,oBAAoB,EAAE;QACxB,MAAM,gBAAgB,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,oBAAoB,CAAC,CAAC;QACvE,IACE,gBAAgB;YAChB,OAAO,CAAC,gBAAgB,EAAE,UAAU,CAAC;YACrC,wBAAwB,CAAC,OAAO,EAChC;YACA,kBAAkB,GAAG,CACnB,KAAC,uBAAuB,IACtB,MAAM,EAAE,wBAAwB,CAAC,OAAO,EACxC,OAAO,EAAE,CAAC,CAAC,oBAAoB,CAAC,EAChC,SAAS,EAAC,YAAY,EACtB,QAAQ,EAAE,GAAG,EAAE;oBACb,IAAI,gBAAgB,CAAC,QAAQ,EAAE,KAAK,KAAK;wBAAE,OAAO;oBAClD,uBAAuB,CAAC,IAAI,CAAC,CAAC;gBAChC,CAAC,EACD,QAAQ,EAAE,GAAG,EAAE;oBACb,IAAI,gBAAgB,CAAC,QAAQ,EAAE,KAAK,KAAK;wBAAE,OAAO;oBAClD,uBAAuB,CAAC,IAAI,CAAC,CAAC;gBAChC,CAAC,YAED,KAAC,gBAAgB,CAAC,QAAQ,KAAG,GACL,CAC3B,CAAC;SACH;KACF;IAED,MAAM,oBAAoB,GAAG,WAAW,CACtC,CACE,EAA+B,EAC/B,IAAY,EACZ,gBAA0D,EAC1D,EAAE;QACF,OAAO;YACL,IAAI,EAAE,CAAC,CAAC,EAAE,CAAC;YACX,EAAE;YACF,IAAI;YACJ,KAAK,EAAE,gBAAgB,CAAC,KAAK;YAC7B,OAAO,EAAE,GAAG,EAAE;gBACZ,IAAI,OAAO,CAAC,gBAAgB,EAAE,UAAU,CAAC,EAAE;oBACzC,uBAAuB,CAAC,EAAE,CAAC,CAAC;oBAC5B,wBAAwB,CAAC,OAAO,GAAG,4BAA4B,CAAC,OAAO,IAAI,SAAS,CAAC;iBACtF;gBACD,IAAI,OAAO,CAAC,gBAAgB,EAAE,OAAO,CAAC,EAAE;oBACtC,2BAA2B,CAAC;wBAC1B,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC;wBACd,IAAI,EAAE;4BACJ,IAAI,EAAE,gBAAgB,CAAC,IAAI;4BAC3B,KAAK,EAAE,gBAAgB,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,EAAE,GAAG,IAAI,EAAE,OAAO,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC;4BAC5E,WAAW,EAAE,gBAAgB,CAAC,WAAW;yBAC1C;qBACF,CAAC,CAAC;oBACH,uBAAuB,CAAC,IAAI,CAAC,CAAC;iBAC/B;YACH,CAAC;SACF,CAAC;IACJ,CAAC,EACD,EAAE,CACH,CAAC;IAEF,MAAM,gBAAgB,GAAG,OAAO,CAAC,GAAG,EAAE;QACpC,IAAI,YAAY,GAAa,EAAE,CAAC;QAChC,IAAI,MAAM,EAAE;YACV,MAAM,YAAY,GAAW,oBAAoB,CAAC,QAAQ,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAC;YAC9E,YAAY,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;SACjC;QACD,IAAI,IAAI,EAAE;YACR,MAAM,UAAU,GAAW,oBAAoB,CAAC,MAAM,EAAE,eAAe,EAAE,IAAI,CAAC,CAAC;YAC/E,YAAY,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;SAC/B;QACD,IAAI,KAAK,EAAE;YACT,MAAM,WAAW,GAAW,oBAAoB,CAAC,OAAO,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC;YACxE,YAAY,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;SAChC;QACD,IAAI,OAAO,EAAE;YACX,YAAY,GAAG,YAAY,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;SAC7C;QAED,OAAO,YAAY,CAAC,MAAM,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,SAAS,CAAC;IACxD,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,oBAAoB,CAAC,CAAC,CAAC;IAEzD,IAAI,SAAS,GAAG,IAAI,CAAC;IAErB,IAAI,YAAY,EAAE;QAChB,MAAM,SAAS,GAAG,OAAO,CAAC,QAAQ,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;QAEvD,IAAI,SAAS,CAAC,MAAM,GAAG,CAAC,EAAE;YACxB,MAAM,gBAAgB,GACpB,OAAO,CAAC,eAAe,CAAC,YAAY,CAAC,KAAK,CAAC,EAAE,IAAI,IAAI,SAAS,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;YAEzE,SAAS,GAAG,GAAG,IAAI,KAAK,gBAAgB,EAAE,CAAC;SAC5C;KACF;IAED,OAAO,CACL,MAAC,IAAI,mBAAc,OAAO,CAAC,IAAI,EAAE,SAAS,WAAK,SAAS,EAAE,EAAE,EAAE,iBAAiB,EAAE,GAAG,EAAE,GAAG,aACvF,MAAC,wBAAwB,IACvB,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,EAClC,GAAG,EAAE,iBAAiB,EACtB,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,aAEjB,MAAC,IAAI,IACH,SAAS,EAAE;4BACT,UAAU,EAAE,OAAO;4BACnB,OAAO,EAAE,SAAS;4BAClB,GAAG,EAAE,GAAG;yBACT,aAED,MAAC,eAAe,IACd,SAAS,EAAE;oCACT,UAAU,EAAE,QAAQ;oCACpB,GAAG,EAAE,CAAC;iCACP,aAED,MAAC,iBAAiB,mBACH,OAAO,CAAC,OAAO,EAC5B,OAAO,EAAE,UAAU,EACnB,QAAQ,EAAE,gBAAgB,EAAE,QAAQ,sBAClB,gBAAgB,EAAE,IAAI,CAAC,CAAC,CAAC,GAAG,GAAG,OAAO,CAAC,CAAC,CAAC,SAAS,aAEnE,gBAAgB,EAAE,IAAI,IAAI,gBAAgB,CAAC,MAAM,KAAK,OAAO,IAAI,CAChE,8BACE,KAAC,eAAe,IAAC,IAAI,EAAC,YAAY,GAAG,EACrC,KAAC,kBAAkB,cAAE,IAAI,CAAC,CAAC,OAAO,CAAC,GAAG,GAAsB,IAC3D,CACJ,EACA,CAAC,YAAY,IAAI,YAAY,CAAC,KAAK,CAAC,MAAM,IAAI,CAAC,CAAC,CAAC,CAAC,CACjD,SAAS,CACV,CAAC,CAAC,CAAC,CACF,KAAC,UAAU,IACT,OAAO,EAAC,MAAM,EACd,IAAI,EAAE,SAAS,EACf,EAAE,EAAE,kBAAkB,EACtB,IAAI,EAAE;oDACJ,IAAI,EAAE,eAAe;oDACrB,KAAK,EAAE,YAAY,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;wDACnC,IAAI,OAAO,CAAC,IAAI,EAAE,OAAO,CAAC,EAAE;4DAC1B,OAAO;gEACL,EAAE,EAAE,IAAI,CAAC,IAAI;gEACb,KAAK,EAAE,IAAI,CAAC,IAAI;gEAChB,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,EAAE;oEAClC,OAAO;wEACL,GAAG,WAAW;wEACd,OAAO,EAAE,gBAAgB,CACvB,WAAW,EACX,EAAE,OAAO,EAAE,CAAC,CAAC,SAAS,CAAC,EAAE,UAAU,EAAE,CAAC,CAAC,aAAa,CAAC,EAAE,EACvD;4EACE,SAAS,EAAE,YAAY,CAAC,SAAS;4EACjC,YAAY,EAAE,YAAY,CAAC,YAAY;yEACxC,CACF;wEACD,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC,CAAC,CAC3B,KAAC,MAAM,OAAK,WAAW,CAAC,MAAM,GAAI,CACnC,CAAC,CAAC,CAAC,SAAS;qEACd,CAAC;gEACJ,CAAC,CAAC;6DACH,CAAC;yDACH;wDAED,OAAO;4DACL,GAAG,IAAI;4DACP,OAAO,EAAE,gBAAgB,CACvB,IAAI,EACJ,EAAE,OAAO,EAAE,CAAC,CAAC,SAAS,CAAC,EAAE,UAAU,EAAE,CAAC,CAAC,aAAa,CAAC,EAAE,EACvD;gEACE,SAAS,EAAE,YAAY,CAAC,SAAS;gEACjC,YAAY,EAAE,YAAY,CAAC,YAAY;6DACxC,CACF;4DACD,MAAM,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,KAAC,MAAM,OAAK,IAAI,CAAC,MAAM,GAAI,CAAC,CAAC,CAAC,SAAS;yDAC9D,CAAC;oDACJ,CAAC,CAAC;oDACF,WAAW,EAAE,YAAY,CAAC,YAAY;iDACvC,EACD,MAAM,EAAE,OAAO,CAAC,YAAY,GAC5B,CACH,IACiB,EACnB,gBAAgB,EAAE,cAAc,IAAI,CACnC,KAAC,cAAc,IACb,OAAO,EAAE,gBAAgB,CAAC,cAAc,CAAC,OAAO,EAChD,eAAe,EAAE,SAAS,YAEzB,gBAAgB,CAAC,cAAc,CAAC,OAAO,GACzB,CAClB,EACA,cAAc,IAAI,KAAK,IAAI,KAAC,SAAS,mBAAc,OAAO,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,GAAI,IACnE,EAClB,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,aAC9C,cAAc,IAAI,iBAAiB,EACnC,MAAM,IAAI,cAAc,IAAI,gBAAgB,EAC5C,cAAc,IAAI,eAAe,EACjC,cAAc,IAAI,gBAAgB,IAAI,CACrC,KAAC,OAAO,IACN,KAAK,EAAE,gBAAgB,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,EAAE,GAAG,eAAe,EAAE,EAAE,EAAE,CAAC,CAAC;4CAC7D,GAAG,eAAe;4CAClB,MAAM,EAAE,IAAI,IAAI,KAAC,IAAI,IAAC,IAAI,EAAE,IAAI,GAAI;yCACrC,CAAC,CAAC,EACH,MAAM,EAAE,CAAC,EACT,GAAG,EAAE,4BAA4B,GACjC,CACH,EACA,CAAC,cAAc,IAAI,KAAK,IAAI,KAAC,SAAS,mBAAc,OAAO,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,GAAI,IAC/E,IACF,EACN,CAAC,cAAc,IAAI,CAClB,8BACG,CAAC,CAAC,KAAK,EAAE,QAAQ,IAAI,iBAAiB,EACvC,MAAC,qBAAqB,IACpB,SAAS,EAAE,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,CAAC,EAAE,aAE9D,KAAC,IAAI,IACH,EAAE,EAAE,gBAAgB,EACpB,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,CAAC,EAAE,EACzD,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,YAEhB,MAAM,IAAI,WAAW,GACjB,EACN,eAAe,EACf,gBAAgB,IAAI,CACnB,KAAC,OAAO,IACN,KAAK,EAAE,gBAAgB,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,EAAE,GAAG,eAAe,EAAE,EAAE,EAAE,CAAC,CAAC;4CAC7D,GAAG,eAAe;4CAClB,MAAM,EAAE,IAAI,IAAI,KAAC,IAAI,IAAC,IAAI,EAAE,IAAI,GAAI;yCACrC,CAAC,CAAC,EACH,MAAM,EAAE,CAAC,EACT,GAAG,EAAE,4BAA4B,GACjC,CACH,IACqB,IACvB,CACJ,EACA,gBAAgB,EAAE,IAAI,IAAI,CACzB,KAAC,UAAU,IACT,IAAI,EACF,gBAAgB,CAAC,MAAM,KAAK,OAAO,IAAI,gBAAgB,CAAC,MAAM,KAAK,SAAS;4BAC1E,CAAC,CAAC,OAAO;4BACT,CAAC,CAAC,SAAS,EAEf,EAAE,EAAE,GAAG,GAAG,OAAO,iBACJ,OAAO,CAAC,IAAI,EACzB,MAAM,EAAE,gBAAgB,CAAC,MAAM,YAE9B,gBAAgB,CAAC,IAAI,GACX,CACd,IACwB,EAE1B,kBAAkB,EAEnB,KAAC,iBAAiB,IAChB,SAAS,EAAE,4BAA4B,EACvC,OAAO,EAAE,wBAAwB,EAAE,OAAO,EAC1C,IAAI,EAAE,wBAAwB,EAAE,IAAI,EACpC,MAAM,EAAE,oBAAoB,EAC5B,OAAO,EAAE,GAAG,EAAE,CAAC,uBAAuB,CAAC,KAAK,CAAC,GAC7C,IACG,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,WAAW,CAAC,WAAW,EAAE,qBAAqB,CAAC,CAAC","sourcesContent":["import { forwardRef, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport type { FunctionComponent, KeyboardEvent, PropsWithoutRef, MouseEvent } from 'react';\n\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport Actions from '../Actions';\nimport Button from '../Button';\nimport type { Action, ForwardProps } from '../../types';\nimport {\n  useBreakpoint,\n  useConfiguration,\n  useConsolidatedRef,\n  useEscape,\n  useI18n,\n  useTestIds,\n  useUID\n} from '../../hooks';\nimport Flex from '../Flex';\nimport SearchInput from '../SearchInput';\nimport Icon, { registerIcon } from '../Icon';\nimport * as filterIcon from '../Icon/icons/filter.icon';\nimport * as arrowUpDownIcon from '../Icon/icons/arrow-up-down.icon';\nimport * as rowIcon from '../Icon/icons/row.icon';\nimport * as plusIcon from '../Icon/icons/plus.icon';\nimport * as moreIcon from '../Icon/icons/more.icon';\nimport { hasProp, withTestIds } from '../../utils';\nimport { formatNumber } from '../Number';\nimport MenuButton from '../MenuButton';\nimport Avatar from '../Avatar';\nimport AdditionalInfo from '../AdditionalInfo';\n\nimport PresetMenuPopover from './PresetMenuPopover';\nimport type { PresetMenuPopoverProps } from './PresetMenuPopover';\nimport {\n  StyledViewSelector,\n  StyledSearchForm,\n  StyledListToolbar,\n  StyledHeadingText,\n  StyledCountMeta,\n  StyledContainer,\n  StyledListToolbarContent,\n  StyledListToolbarDialog,\n  StyledErrorIcon,\n  StyledInfo,\n  StyledSearchContainer\n} from './ListToolbar.styles';\nimport type {\n  ListToolbarProps,\n  PresetMenuProps,\n  QueryOptionDialogProps,\n  QueryOptionId,\n  ViewProps,\n  ViewSelectorProps\n} from './ListToolbar.types';\nimport helpers from './helpers';\nimport { getListToolbarTestIds } from './ListToolbar.test-ids';\n\nregisterIcon(filterIcon, arrowUpDownIcon, rowIcon, plusIcon, moreIcon);\n\nconst CountMeta = ({\n  count,\n  ...restProps\n}: { count: NonNullable<ListToolbarProps['count']> } & ForwardProps) => {\n  const { locale } = useConfiguration();\n  const t = useI18n();\n  const totalFormattedValue = formatNumber(count.total ?? 0, {\n    locale,\n    options: {\n      useGrouping: true\n    }\n  });\n  return (\n    <StyledCountMeta variant='secondary' {...restProps}>\n      {count.selected\n        ? t(\n            'selected_count',\n            [formatNumber(count.selected, { locale, options: { useGrouping: true } })],\n            { count: count.selected }\n          )\n        : count.total !== undefined &&\n          t(\n            'results_count',\n            [count.totalHasMore ? `${totalFormattedValue}+` : totalFormattedValue],\n            {\n              count: count.total\n            }\n          )}\n    </StyledCountMeta>\n  );\n};\n\nconst generateViewName = (\n  view: ViewProps,\n  texts: { default: string; appDefault: string },\n  options: {\n    defaultId?: ViewSelectorProps['defaultId'];\n    appDefaultId?: ViewSelectorProps['appDefaultId'];\n  }\n) => {\n  return `${view.text} ${view.id === options.defaultId ? `(${texts.default})` : ''} ${\n    view.id === options.appDefaultId ? `(${texts.appDefault})` : ''\n  }`;\n};\n\nconst ListToolbar: FunctionComponent<ListToolbarProps & ForwardProps> = forwardRef(\n  function ListToolbar(\n    {\n      testId,\n      name,\n      headingTag = 'h3',\n      viewSelector,\n      formControlProps,\n      createNew,\n      search,\n      count,\n      additionalActions,\n      filter,\n      sort,\n      group,\n      actions,\n      actionsButtonRef,\n      ...restProps\n    }: PropsWithoutRef<ListToolbarProps>,\n    ref: ListToolbarProps['ref']\n  ) {\n    const uid = useUID();\n    const t = useI18n();\n    const testIds = useTestIds(testId, getListToolbarTestIds);\n\n    const isSmallOrAbove = useBreakpoint('sm');\n    const consolidatedActionsButtonRef = useConsolidatedRef(actionsButtonRef);\n    const toolbarContentRef = useRef<HTMLDivElement>(null);\n    const searchInputRef = useRef<HTMLInputElement>(null);\n    const searchButtonRef = useRef<HTMLButtonElement>(null);\n    const [isSearchOpen, setIsSearchOpen] = useState(!!search?.value);\n\n    const onSearchEscape = () => {\n      if (!search?.value) {\n        setIsSearchOpen(false);\n      }\n      setTimeout(() => searchButtonRef.current?.focus());\n    };\n\n    useEffect(() => {\n      if (search?.value) {\n        setIsSearchOpen(true);\n      }\n    }, [search?.value]);\n\n    const [currentQueryOptionId, setCurrentQueryOptionId] = useState<QueryOptionId | null>(null);\n    const queryOptionPopoverTarget = useRef<HTMLButtonElement>();\n\n    const [actionsQueryOptionPreset, setActionsQueryOptionPreset] =\n      useState<Pick<PresetMenuPopoverProps, 'heading' | 'menu'>>();\n    const [optionPresetMenuOpen, setOptionPresetMenuOpen] = useState(false);\n\n    const createNewButton = useMemo(() => {\n      if (!createNew?.onClick) return null;\n      const text = createNew.label ?? t('create_new');\n\n      return (\n        <Button variant='simple' icon label={text} aria-label={text} onClick={createNew.onClick}>\n          <Icon name='plus' />\n        </Button>\n      );\n    }, [t, createNew, isSmallOrAbove]);\n\n    useEscape(onSearchEscape, searchInputRef);\n    const searchInput = useMemo(\n      () => (\n        <SearchInput\n          {...search}\n          onSearchSubmit={(value: string) => {\n            search?.onSearchSubmit?.(value);\n            onSearchEscape();\n          }}\n          onClick={(e: MouseEvent<HTMLInputElement>) => {\n            e.preventDefault();\n          }}\n          onBlur={() => {\n            if (!search?.value) {\n              setIsSearchOpen(false);\n            }\n          }}\n          ref={searchInputRef}\n        />\n      ),\n      [search, onSearchEscape]\n    );\n\n    const searchLabel = t('search');\n    const expandableSearch = useMemo(() => {\n      return isSearchOpen ? (\n        searchInput\n      ) : (\n        <Button\n          variant='simple'\n          icon\n          label={searchLabel}\n          onClick={() => {\n            setIsSearchOpen(true);\n            setTimeout(() => searchInputRef.current?.focus());\n          }}\n          onKeyDown={(e: KeyboardEvent<HTMLElement>) => {\n            if (e.target !== searchInputRef.current && (e.key === 'Enter' || e.key === ' ')) {\n              setIsSearchOpen(true);\n              setTimeout(() => {\n                searchInputRef.current?.focus();\n                searchInputRef.current?.select();\n              });\n            }\n          }}\n          ref={searchButtonRef}\n        >\n          <Icon name='search' />\n        </Button>\n      );\n    }, [searchLabel, setIsSearchOpen, isSearchOpen, searchInput]);\n\n    let queryOptionPopover = null;\n    if (currentQueryOptionId) {\n      const queryOptionProps = { filter, sort, group }[currentQueryOptionId];\n      if (\n        queryOptionProps &&\n        hasProp(queryOptionProps, 'renderer') &&\n        queryOptionPopoverTarget.current\n      ) {\n        queryOptionPopover = (\n          <StyledListToolbarDialog\n            target={queryOptionPopoverTarget.current}\n            heading={t(currentQueryOptionId)}\n            placement='bottom-end'\n            onCancel={() => {\n              if (queryOptionProps.onCancel() === false) return;\n              setCurrentQueryOptionId(null);\n            }}\n            onSubmit={() => {\n              if (queryOptionProps.onSubmit() === false) return;\n              setCurrentQueryOptionId(null);\n            }}\n          >\n            <queryOptionProps.renderer />\n          </StyledListToolbarDialog>\n        );\n      }\n    }\n\n    const getQueryOptionAction = useCallback(\n      (\n        id: 'sort' | 'group' | 'filter',\n        icon: string,\n        queryOptionProps: QueryOptionDialogProps | PresetMenuProps\n      ) => {\n        return {\n          text: t(id),\n          id,\n          icon,\n          count: queryOptionProps.count,\n          onClick: () => {\n            if (hasProp(queryOptionProps, 'renderer')) {\n              setCurrentQueryOptionId(id);\n              queryOptionPopoverTarget.current = consolidatedActionsButtonRef.current ?? undefined;\n            }\n            if (hasProp(queryOptionProps, 'items')) {\n              setActionsQueryOptionPreset({\n                heading: t(id),\n                menu: {\n                  mode: queryOptionProps.mode,\n                  items: queryOptionProps.items.map(item => ({ ...item, primary: item.text })),\n                  onItemClick: queryOptionProps.onItemClick\n                }\n              });\n              setOptionPresetMenuOpen(true);\n            }\n          }\n        };\n      },\n      []\n    );\n\n    const basicModeActions = useMemo(() => {\n      let basicActions: Action[] = [];\n      if (filter) {\n        const filterAction: Action = getQueryOptionAction('filter', 'filter', filter);\n        basicActions.push(filterAction);\n      }\n      if (sort) {\n        const sortAction: Action = getQueryOptionAction('sort', 'arrow-up-down', sort);\n        basicActions.push(sortAction);\n      }\n      if (group) {\n        const groupAction: Action = getQueryOptionAction('group', 'row', group);\n        basicActions.push(groupAction);\n      }\n      if (actions) {\n        basicActions = basicActions.concat(actions);\n      }\n\n      return basicActions.length ? basicActions : undefined;\n    }, [actions, filter, sort, group, getQueryOptionAction]);\n\n    let labelText = name;\n\n    if (viewSelector) {\n      const viewItems = helpers.getViews(viewSelector.views);\n\n      if (viewItems.length > 1) {\n        const selectedViewName =\n          helpers.getSelectedView(viewSelector.views)?.text ?? viewItems[0].text;\n\n        labelText = `${name}: ${selectedViewName}`;\n      }\n    }\n\n    return (\n      <Flex data-testid={testIds.root} container {...restProps} as={StyledListToolbar} ref={ref}>\n        <StyledListToolbarContent\n          container={{ direction: 'column' }}\n          ref={toolbarContentRef}\n          item={{ grow: 1 }}\n        >\n          <Flex\n            container={{\n              alignItems: 'start',\n              justify: 'between',\n              gap: 0.5\n            }}\n          >\n            <StyledContainer\n              container={{\n                alignItems: 'center',\n                gap: 1\n              }}\n            >\n              <StyledHeadingText\n                data-testid={testIds.heading}\n                variant={headingTag}\n                required={formControlProps?.required}\n                aria-describedby={formControlProps?.info ? `${uid}-info` : undefined}\n              >\n                {formControlProps?.info && formControlProps.status === 'error' && (\n                  <>\n                    <StyledErrorIcon name='warn-solid' />\n                    <VisuallyHiddenText>{` ${t('error')} `}</VisuallyHiddenText>\n                  </>\n                )}\n                {!viewSelector || viewSelector.views.length <= 1 ? (\n                  labelText\n                ) : (\n                  <MenuButton\n                    variant='text'\n                    text={labelText}\n                    as={StyledViewSelector}\n                    menu={{\n                      mode: 'single-select',\n                      items: viewSelector.views.map(view => {\n                        if (hasProp(view, 'items')) {\n                          return {\n                            id: view.text,\n                            label: view.text,\n                            items: view.items.map(groupedView => {\n                              return {\n                                ...groupedView,\n                                primary: generateViewName(\n                                  groupedView,\n                                  { default: t('default'), appDefault: t('app_default') },\n                                  {\n                                    defaultId: viewSelector.defaultId,\n                                    appDefaultId: viewSelector.appDefaultId\n                                  }\n                                ),\n                                visual: groupedView.visual ? (\n                                  <Avatar {...groupedView.visual} />\n                                ) : undefined\n                              };\n                            })\n                          };\n                        }\n\n                        return {\n                          ...view,\n                          primary: generateViewName(\n                            view,\n                            { default: t('default'), appDefault: t('app_default') },\n                            {\n                              defaultId: viewSelector.defaultId,\n                              appDefaultId: viewSelector.appDefaultId\n                            }\n                          ),\n                          visual: view.visual ? <Avatar {...view.visual} /> : undefined\n                        };\n                      }),\n                      onItemClick: viewSelector.onViewSelect\n                    }}\n                    testId={testIds.viewSelector}\n                  />\n                )}\n              </StyledHeadingText>\n              {formControlProps?.additionalInfo && (\n                <AdditionalInfo\n                  heading={formControlProps.additionalInfo.heading}\n                  contextualLabel={labelText}\n                >\n                  {formControlProps.additionalInfo.content}\n                </AdditionalInfo>\n              )}\n              {isSmallOrAbove && count && <CountMeta data-testid={testIds.count} count={count} />}\n            </StyledContainer>\n            <Flex container={{ alignItems: 'center', gap: 1 }}>\n              {isSmallOrAbove && additionalActions}\n              {search && isSmallOrAbove && expandableSearch}\n              {isSmallOrAbove && createNewButton}\n              {isSmallOrAbove && basicModeActions && (\n                <Actions\n                  items={basicModeActions.map(({ icon, ...restActionProps }) => ({\n                    ...restActionProps,\n                    visual: icon && <Icon name={icon} />\n                  }))}\n                  menuAt={1}\n                  ref={consolidatedActionsButtonRef}\n                />\n              )}\n              {!isSmallOrAbove && count && <CountMeta data-testid={testIds.count} count={count} />}\n            </Flex>\n          </Flex>\n          {!isSmallOrAbove && (\n            <>\n              {!!count?.selected && additionalActions}\n              <StyledSearchContainer\n                container={{ alignItems: 'start', justify: 'between', gap: 1 }}\n              >\n                <Flex\n                  as={StyledSearchForm}\n                  container={{ alignItems: 'center', wrap: 'wrap', gap: 1 }}\n                  item={{ grow: 1 }}\n                >\n                  {search && searchInput}\n                </Flex>\n                {createNewButton}\n                {basicModeActions && (\n                  <Actions\n                    items={basicModeActions.map(({ icon, ...restActionProps }) => ({\n                      ...restActionProps,\n                      visual: icon && <Icon name={icon} />\n                    }))}\n                    menuAt={1}\n                    ref={consolidatedActionsButtonRef}\n                  />\n                )}\n              </StyledSearchContainer>\n            </>\n          )}\n          {formControlProps?.info && (\n            <StyledInfo\n              role={\n                formControlProps.status === 'error' || formControlProps.status === 'warning'\n                  ? 'alert'\n                  : undefined\n              }\n              id={`${uid}-info`}\n              data-testid={testIds.info}\n              status={formControlProps.status}\n            >\n              {formControlProps.info}\n            </StyledInfo>\n          )}\n        </StyledListToolbarContent>\n\n        {queryOptionPopover}\n\n        <PresetMenuPopover\n          buttonRef={consolidatedActionsButtonRef}\n          heading={actionsQueryOptionPreset?.heading}\n          menu={actionsQueryOptionPreset?.menu}\n          isOpen={optionPresetMenuOpen}\n          onClose={() => setOptionPresetMenuOpen(false)}\n        />\n      </Flex>\n    );\n  }\n);\n\nexport default withTestIds(ListToolbar, getListToolbarTestIds);\n"]}

package/lib/components/ListToolbar/ListToolbar.styles.d.ts

@@ -13,4 +13,5 @@ export declare const StyledHeadingText: import("styled-components").StyledCompon
 export declare const StyledCountMeta: import("styled-components").StyledComponent<import("react").FunctionComponent<import("../Text").TextProps & import("../..").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledContainer: import("styled-components").StyledComponent<import("react").FunctionComponent<import("../Flex").FlexProps & import("../..").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledInfo: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, Pick<FormControlProps, "status">, never>;
+export declare const StyledSearchContainer: import("styled-components").StyledComponent<import("react").FunctionComponent<import("../Flex").FlexProps & import("../..").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
 //# sourceMappingURL=ListToolbar.styles.d.ts.map

package/lib/components/ListToolbar/ListToolbar.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ListToolbar.styles.d.ts","sourceRoot":"","sources":["../../../src/components/ListToolbar/ListToolbar.styles.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAWvD,eAAO,MAAM,gBAAgB,yGAK5B,CAAC;AAEF,eAAO,MAAM,kBAAkB;cAA6B,OAAO;SA0BjE,CAAC;AAIH,eAAO,MAAM,iBAAiB,yGAAe,CAAC;AAI9C,eAAO,MAAM,uBAAuB,uuJAKlC,CAAC;AAIH,eAAO,MAAM,wBAAwB,iMAOnC,CAAC;AAIH,eAAO,MAAM,eAAe,0KAI3B,CAAC;AAIF,eAAO,MAAM,iBAAiB;;SAgC5B,CAAC;AAIH,eAAO,MAAM,eAAe,iMAW1B,CAAC;AAIH,eAAO,MAAM,eAAe,iMAU3B,CAAC;AAEF,eAAO,MAAM,UAAU,uIAatB,CAAC"}
+{"version":3,"file":"ListToolbar.styles.d.ts","sourceRoot":"","sources":["../../../src/components/ListToolbar/ListToolbar.styles.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAWvD,eAAO,MAAM,gBAAgB,yGAK5B,CAAC;AAEF,eAAO,MAAM,kBAAkB;cAA6B,OAAO;SA0BjE,CAAC;AAIH,eAAO,MAAM,iBAAiB,yGAAe,CAAC;AAI9C,eAAO,MAAM,uBAAuB,uuJAKlC,CAAC;AAIH,eAAO,MAAM,wBAAwB,iMAOnC,CAAC;AAIH,eAAO,MAAM,eAAe,0KAI3B,CAAC;AAIF,eAAO,MAAM,iBAAiB;;SAgC5B,CAAC;AAIH,eAAO,MAAM,eAAe,iMAW1B,CAAC;AAIH,eAAO,MAAM,eAAe,iMAc1B,CAAC;AAIH,eAAO,MAAM,UAAU,uIAatB,CAAC;AAIF,eAAO,MAAM,qBAAqB,iMASjC,CAAC"}

package/lib/components/ListToolbar/ListToolbar.styles.js

@@ -107,17 +107,22 @@ export const StyledCountMeta = styled(Text)(({ theme }) => {
   `;
 });
 StyledCountMeta.defaultProps = defaultThemeProp;
-export const StyledContainer = styled(Flex) `
-  @media (pointer: coarse) {
-    overflow: hidden;
+export const StyledContainer = styled(Flex)(({ theme }) => {
+    return css `
+    margin-block-end: ${theme.base.spacing};
 
-    ${StyledHeadingText}, ${StyledViewSelector} ${StyledText} {
-      white-space: nowrap;
+    @media (pointer: coarse) {
       overflow: hidden;
-      text-overflow: ellipsis;
+
+      ${StyledHeadingText}, ${StyledViewSelector} ${StyledText} {
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
     }
-  }
-`;
+  `;
+});
+StyledContainer.defaultProps = defaultThemeProp;
 export const StyledInfo = styled.div(({ status, theme: { components: { 'form-field': formField } } }) => css `
     ${status &&
     formField[status] &&
@@ -126,4 +131,12 @@ export const StyledInfo = styled.div(({ status, theme: { components: { 'form-fie
     `}
   `);
 StyledInfo.defaultProps = defaultThemeProp;
+export const StyledSearchContainer = styled(Flex)(({ theme }) => css `
+      margin-block: ${theme.base.spacing};
+
+      ${StyledSearchInput} {
+        max-width: 100%;
+      }
+    `);
+StyledSearchContainer.defaultProps = defaultThemeProp;
 //# sourceMappingURL=ListToolbar.styles.js.map

package/lib/components/ListToolbar/ListToolbar.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListToolbar.styles.js","sourceRoot":"","sources":["../../../src/components/ListToolbar/ListToolbar.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport type { FormControlProps } from '../FormControl';\nimport Icon from '../Icon';\nimport Flex from '../Flex';\nimport { StyledSearchInput } from '../SearchInput';\nimport Text, { StyledText } from '../Text';\nimport { defaultThemeProp } from '../../theme';\nimport { calculateFontSize } from '../../styles';\nimport type { FontSize } from '../../styles';\nimport { StyledButton } from '../Button';\nimport FormDialog from '../Dialog/FormDialog';\n\nexport const StyledSearchForm = styled.div`\n  ${StyledSearchInput} {\n    flex-grow: 1;\n    max-width: min(100%, 40ch);\n  }\n`;\n\nexport const StyledViewSelector = styled.button<{ required: boolean }>(({ theme, required }) => {\n  const fontSizes = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n  const { urgent } = theme.base.palette;\n  const hitAreaMouse = theme.base['hit-area']['mouse-min'];\n  const hitAreaFinger = theme.base['hit-area']['finger-min'];\n\n  return css`\n    flex-shrink: initial;\n    white-space: initial;\n    ${StyledText} {\n      font-size: ${fontSizes[theme.components.text.h3['font-size'] as FontSize]};\n      font-weight: ${theme.components.text.h3['font-weight']};\n      line-height: ${hitAreaMouse};\n      word-break: break-word;\n      @media (pointer: coarse) {\n        line-height: ${hitAreaFinger};\n      }\n    }\n\n    ${StyledText}::after {\n      display: ${required ? 'inline-block' : 'none'};\n      content: '\\\\00a0*';\n      vertical-align: top;\n      color: ${urgent};\n    }\n  `;\n});\n\nStyledViewSelector.defaultProps = defaultThemeProp;\n\nexport const StyledListToolbar = styled.div``;\n\nStyledListToolbar.defaultProps = defaultThemeProp;\n\nexport const StyledListToolbarDialog = styled(FormDialog)(({ theme }) => {\n  return css`\n    min-width: min(${theme.base['content-width'].lg}, calc(100% - 2rem));\n    max-width: calc(100vw - 4 * ${theme.base.spacing});\n  `;\n});\n\nStyledListToolbarDialog.defaultProps = defaultThemeProp;\n\nexport const StyledListToolbarContent = styled(Flex)(({ theme }) => {\n  return css`\n    ${StyledButton} + ${StyledButton} {\n      margin-inline-start: 0;\n    }\n    border-radius: calc(0.25 * ${theme.base['border-radius']});\n  `;\n});\n\nStyledListToolbarContent.defaultProps = defaultThemeProp;\n\nexport const StyledErrorIcon = styled(Icon)(\n  ({ theme }) => css`\n    color: ${theme.base.palette.urgent};\n  `\n);\n\nStyledErrorIcon.defaultProps = defaultThemeProp;\n\nexport const StyledHeadingText = styled(Text)<{ required?: boolean }>(({ theme, required }) => {\n  const { urgent } = theme.base.palette;\n  const hitAreaMouse = theme.base['hit-area']['mouse-min'];\n  const hitAreaFinger = theme.base['hit-area']['finger-min'];\n\n  return css`\n    position: relative;\n    line-height: ${hitAreaMouse};\n    word-break: break-word;\n    display: flex;\n    align-items: center;\n    ${required &&\n    css`\n      padding-inline-end: calc(1.5 * ${theme.base.spacing});\n    `}\n    @media (pointer: coarse) {\n      line-height: ${hitAreaFinger};\n    }\n    &::after {\n      display: ${required ? 'inline' : 'none'};\n      content: '\\\\00a0*';\n      vertical-align: top;\n      color: ${urgent};\n      position: absolute;\n      inset-inline-end: 0;\n      inset-block-start: 0;\n    }\n\n    ${StyledErrorIcon} {\n      margin-inline-end: calc(0.5 * ${theme.base.spacing});\n    }\n  `;\n});\n\nStyledHeadingText.defaultProps = defaultThemeProp;\n\nexport const StyledCountMeta = styled(Text)(({ theme }) => {\n  const hitAreaMouse = theme.base['hit-area']['mouse-min'];\n  const hitAreaFinger = theme.base['hit-area']['finger-min'];\n\n  return css`\n    line-height: ${hitAreaMouse};\n\n    @media (pointer: coarse) {\n      line-height: ${hitAreaFinger};\n    }\n  `;\n});\n\nStyledCountMeta.defaultProps = defaultThemeProp;\n\nexport const StyledContainer = styled(Flex)`\n  @media (pointer: coarse) {\n    overflow: hidden;\n\n    ${StyledHeadingText}, ${StyledViewSelector} ${StyledText} {\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n  }\n`;\n\nexport const StyledInfo = styled.div<Pick<FormControlProps, 'status'>>(\n  ({\n    status,\n    theme: {\n      components: { 'form-field': formField }\n    }\n  }) => css`\n    ${status &&\n    formField[status] &&\n    css`\n      color: ${formField[status]['status-color']};\n    `}\n  `\n);\n\nStyledInfo.defaultProps = defaultThemeProp;\n"]}
+{"version":3,"file":"ListToolbar.styles.js","sourceRoot":"","sources":["../../../src/components/ListToolbar/ListToolbar.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport type { FormControlProps } from '../FormControl';\nimport Icon from '../Icon';\nimport Flex from '../Flex';\nimport { StyledSearchInput } from '../SearchInput';\nimport Text, { StyledText } from '../Text';\nimport { defaultThemeProp } from '../../theme';\nimport { calculateFontSize } from '../../styles';\nimport type { FontSize } from '../../styles';\nimport { StyledButton } from '../Button';\nimport FormDialog from '../Dialog/FormDialog';\n\nexport const StyledSearchForm = styled.div`\n  ${StyledSearchInput} {\n    flex-grow: 1;\n    max-width: min(100%, 40ch);\n  }\n`;\n\nexport const StyledViewSelector = styled.button<{ required: boolean }>(({ theme, required }) => {\n  const fontSizes = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n  const { urgent } = theme.base.palette;\n  const hitAreaMouse = theme.base['hit-area']['mouse-min'];\n  const hitAreaFinger = theme.base['hit-area']['finger-min'];\n\n  return css`\n    flex-shrink: initial;\n    white-space: initial;\n    ${StyledText} {\n      font-size: ${fontSizes[theme.components.text.h3['font-size'] as FontSize]};\n      font-weight: ${theme.components.text.h3['font-weight']};\n      line-height: ${hitAreaMouse};\n      word-break: break-word;\n      @media (pointer: coarse) {\n        line-height: ${hitAreaFinger};\n      }\n    }\n\n    ${StyledText}::after {\n      display: ${required ? 'inline-block' : 'none'};\n      content: '\\\\00a0*';\n      vertical-align: top;\n      color: ${urgent};\n    }\n  `;\n});\n\nStyledViewSelector.defaultProps = defaultThemeProp;\n\nexport const StyledListToolbar = styled.div``;\n\nStyledListToolbar.defaultProps = defaultThemeProp;\n\nexport const StyledListToolbarDialog = styled(FormDialog)(({ theme }) => {\n  return css`\n    min-width: min(${theme.base['content-width'].lg}, calc(100% - 2rem));\n    max-width: calc(100vw - 4 * ${theme.base.spacing});\n  `;\n});\n\nStyledListToolbarDialog.defaultProps = defaultThemeProp;\n\nexport const StyledListToolbarContent = styled(Flex)(({ theme }) => {\n  return css`\n    ${StyledButton} + ${StyledButton} {\n      margin-inline-start: 0;\n    }\n    border-radius: calc(0.25 * ${theme.base['border-radius']});\n  `;\n});\n\nStyledListToolbarContent.defaultProps = defaultThemeProp;\n\nexport const StyledErrorIcon = styled(Icon)(\n  ({ theme }) => css`\n    color: ${theme.base.palette.urgent};\n  `\n);\n\nStyledErrorIcon.defaultProps = defaultThemeProp;\n\nexport const StyledHeadingText = styled(Text)<{ required?: boolean }>(({ theme, required }) => {\n  const { urgent } = theme.base.palette;\n  const hitAreaMouse = theme.base['hit-area']['mouse-min'];\n  const hitAreaFinger = theme.base['hit-area']['finger-min'];\n\n  return css`\n    position: relative;\n    line-height: ${hitAreaMouse};\n    word-break: break-word;\n    display: flex;\n    align-items: center;\n    ${required &&\n    css`\n      padding-inline-end: calc(1.5 * ${theme.base.spacing});\n    `}\n    @media (pointer: coarse) {\n      line-height: ${hitAreaFinger};\n    }\n    &::after {\n      display: ${required ? 'inline' : 'none'};\n      content: '\\\\00a0*';\n      vertical-align: top;\n      color: ${urgent};\n      position: absolute;\n      inset-inline-end: 0;\n      inset-block-start: 0;\n    }\n\n    ${StyledErrorIcon} {\n      margin-inline-end: calc(0.5 * ${theme.base.spacing});\n    }\n  `;\n});\n\nStyledHeadingText.defaultProps = defaultThemeProp;\n\nexport const StyledCountMeta = styled(Text)(({ theme }) => {\n  const hitAreaMouse = theme.base['hit-area']['mouse-min'];\n  const hitAreaFinger = theme.base['hit-area']['finger-min'];\n\n  return css`\n    line-height: ${hitAreaMouse};\n\n    @media (pointer: coarse) {\n      line-height: ${hitAreaFinger};\n    }\n  `;\n});\n\nStyledCountMeta.defaultProps = defaultThemeProp;\n\nexport const StyledContainer = styled(Flex)(({ theme }) => {\n  return css`\n    margin-block-end: ${theme.base.spacing};\n\n    @media (pointer: coarse) {\n      overflow: hidden;\n\n      ${StyledHeadingText}, ${StyledViewSelector} ${StyledText} {\n        white-space: nowrap;\n        overflow: hidden;\n        text-overflow: ellipsis;\n      }\n    }\n  `;\n});\n\nStyledContainer.defaultProps = defaultThemeProp;\n\nexport const StyledInfo = styled.div<Pick<FormControlProps, 'status'>>(\n  ({\n    status,\n    theme: {\n      components: { 'form-field': formField }\n    }\n  }) => css`\n    ${status &&\n    formField[status] &&\n    css`\n      color: ${formField[status]['status-color']};\n    `}\n  `\n);\n\nStyledInfo.defaultProps = defaultThemeProp;\n\nexport const StyledSearchContainer = styled(Flex)(\n  ({ theme }) =>\n    css`\n      margin-block: ${theme.base.spacing};\n\n      ${StyledSearchInput} {\n        max-width: 100%;\n      }\n    `\n);\n\nStyledSearchContainer.defaultProps = defaultThemeProp;\n"]}

package/lib/components/NoValue/NoValue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NoValue.d.ts","sourceRoot":"","sources":["../../../src/components/NoValue/NoValue.tsx"],"names":[],"mappings":"AAGA,QAAA,MAAM,OAAO,mBAQZ,CAAC;AAEF,eAAe,OAAO,CAAC"}
+{"version":3,"file":"NoValue.d.ts","sourceRoot":"","sources":["../../../src/components/NoValue/NoValue.tsx"],"names":[],"mappings":"AAUA,QAAA,MAAM,OAAO,mBAQZ,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/lib/components/NoValue/NoValue.js

@@ -1,9 +1,14 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import styled from 'styled-components';
 import { useI18n } from '../../hooks';
 import VisuallyHiddenText from '../VisuallyHiddenText/VisuallyHiddenText';
+const StyledNoValue = styled.span `
+  display: inline-block;
+  position: relative;
+`;
 const NoValue = () => {
     const t = useI18n();
-    return (_jsxs("span", { children: [_jsx("span", { "aria-hidden": true, children: "\u2013\u2013" }), _jsx(VisuallyHiddenText, { children: t('no_value') })] }));
+    return (_jsxs(StyledNoValue, { children: [_jsx("span", { "aria-hidden": true, children: "\u2013\u2013" }), _jsx(VisuallyHiddenText, { children: t('no_value') })] }));
 };
 export default NoValue;
 //# sourceMappingURL=NoValue.js.map

package/lib/components/NoValue/NoValue.js.map

@@ -1 +1 @@
-{"version":3,"file":"NoValue.js","sourceRoot":"","sources":["../../../src/components/NoValue/NoValue.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AACtC,OAAO,kBAAkB,MAAM,0CAA0C,CAAC;AAE1E,MAAM,OAAO,GAAG,GAAG,EAAE;IACnB,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,OAAO,CACL,2BACE,+DAAuC,EACvC,KAAC,kBAAkB,cAAE,CAAC,CAAC,UAAU,CAAC,GAAsB,IACnD,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,OAAO,CAAC","sourcesContent":["import { useI18n } from '../../hooks';\nimport VisuallyHiddenText from '../VisuallyHiddenText/VisuallyHiddenText';\n\nconst NoValue = () => {\n  const t = useI18n();\n  return (\n    <span>\n      <span aria-hidden>&ndash;&ndash;</span>\n      <VisuallyHiddenText>{t('no_value')}</VisuallyHiddenText>\n    </span>\n  );\n};\n\nexport default NoValue;\n"]}
+{"version":3,"file":"NoValue.js","sourceRoot":"","sources":["../../../src/components/NoValue/NoValue.tsx"],"names":[],"mappings":";AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AACtC,OAAO,kBAAkB,MAAM,0CAA0C,CAAC;AAE1E,MAAM,aAAa,GAAG,MAAM,CAAC,IAAI,CAAA;;;CAGhC,CAAC;AAEF,MAAM,OAAO,GAAG,GAAG,EAAE;IACnB,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,OAAO,CACL,MAAC,aAAa,eACZ,+DAAuC,EACvC,KAAC,kBAAkB,cAAE,CAAC,CAAC,UAAU,CAAC,GAAsB,IAC1C,CACjB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,OAAO,CAAC","sourcesContent":["import styled from 'styled-components';\n\nimport { useI18n } from '../../hooks';\nimport VisuallyHiddenText from '../VisuallyHiddenText/VisuallyHiddenText';\n\nconst StyledNoValue = styled.span`\n  display: inline-block;\n  position: relative;\n`;\n\nconst NoValue = () => {\n  const t = useI18n();\n  return (\n    <StyledNoValue>\n      <span aria-hidden>&ndash;&ndash;</span>\n      <VisuallyHiddenText>{t('no_value')}</VisuallyHiddenText>\n    </StyledNoValue>\n  );\n};\n\nexport default NoValue;\n"]}

package/lib/components/RadioCheck/RadioCheck.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RadioCheck.d.ts","sourceRoot":"","sources":["../../../src/components/RadioCheck/RadioCheck.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,EAAE,EACF,GAAG,EAIH,iBAAiB,EACjB,oBAAoB,EACrB,MAAM,OAAO,CAAC;AAMf,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAGvD,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAM3E,MAAM,WAAW,eAAgB,SAAQ,SAAS,EAAE,cAAc;IAChE;;;OAGG;IACH,EAAE,CAAC,EAAE,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAC5B,2DAA2D;IAC3D,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,wEAAwE;IACxE,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,qFAAqF;IACrF,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,oDAAoD;IACpD,MAAM,CAAC,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACpC,+FAA+F;IAC/F,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,8BAA8B;IAC9B,IAAI,EAAE,OAAO,GAAG,UAAU,CAAC;IAC3B,yEAAyE;IACzE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,oEAAoE;IACpE,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,OAAO,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IAC5B,4CAA4C;IAC5C,OAAO,CAAC,EAAE,iBAAiB,CAAC,gBAAgB,CAAC,CAAC;IAC9C,8CAA8C;IAC9C,SAAS,CAAC,EAAE,oBAAoB,CAAC,gBAAgB,CAAC,CAAC;IACnD,8EAA8E;IAC9E,cAAc,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACpD,iDAAiD;IACjD,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,6CAA6C;IAC7C,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;CAC7B;AAED,eAAO,MAAM,sBAAsB,mJAiDlC,CAAC;AAIF,eAAO,MAAM,qBAAqB,2GAuGhC,CAAC;AAIH,eAAO,MAAM,gBAAgB,qJAkD5B,CAAC;AAIF,eAAO,MAAM,oBAAoB,kKAgEhC,CAAC;AAIF,QAAA,MAAM,UAAU,EAAE,EAAE,CAAC,eAAe,GAAG,YAAY,CA2FjD,CAAC;AAEH,eAAe,UAAU,CAAC"}
+{"version":3,"file":"RadioCheck.d.ts","sourceRoot":"","sources":["../../../src/components/RadioCheck/RadioCheck.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,EAAE,EACF,GAAG,EAIH,iBAAiB,EACjB,oBAAoB,EACrB,MAAM,OAAO,CAAC;AAMf,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAGvD,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAM3E,MAAM,WAAW,eAAgB,SAAQ,SAAS,EAAE,cAAc;IAChE;;;OAGG;IACH,EAAE,CAAC,EAAE,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAC5B,2DAA2D;IAC3D,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,wEAAwE;IACxE,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,qFAAqF;IACrF,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,oDAAoD;IACpD,MAAM,CAAC,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACpC,+FAA+F;IAC/F,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,8BAA8B;IAC9B,IAAI,EAAE,OAAO,GAAG,UAAU,CAAC;IAC3B,yEAAyE;IACzE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,oEAAoE;IACpE,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,OAAO,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IAC5B,4CAA4C;IAC5C,OAAO,CAAC,EAAE,iBAAiB,CAAC,gBAAgB,CAAC,CAAC;IAC9C,8CAA8C;IAC9C,SAAS,CAAC,EAAE,oBAAoB,CAAC,gBAAgB,CAAC,CAAC;IACnD,8EAA8E;IAC9E,cAAc,CAAC,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IACpD,iDAAiD;IACjD,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,6CAA6C;IAC7C,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;CAC7B;AAED,eAAO,MAAM,sBAAsB,mJAiDlC,CAAC;AAIF,eAAO,MAAM,qBAAqB,2GAuGhC,CAAC;AAIH,eAAO,MAAM,gBAAgB,qJAkD5B,CAAC;AAIF,eAAO,MAAM,oBAAoB,kKAgEhC,CAAC;AAIF,QAAA,MAAM,UAAU,EAAE,EAAE,CAAC,eAAe,GAAG,YAAY,CA8FjD,CAAC;AAEH,eAAe,UAAU,CAAC"}

package/lib/components/RadioCheck/RadioCheck.js

@@ -211,7 +211,9 @@ const RadioCheck = forwardRef(function RadioCheck(props, ref) {
             newRef.current.indeterminate = !!indeterminate;
         }
     }, [newRef, indeterminate, isRadio]);
-    return (_jsx(FormField, { as: card ? StyledRadioCheckCard : StyledRadioCheck, label: _jsxs(_Fragment, { children: [_jsx(StyledPseudoRadioCheck, { status: status, isRadio: isRadio, as: StyledFormControl, required: required, disabled: disabled, readOnly: readOnly }), _jsxs(_Fragment, { children: [label, readOnly && _jsx(VisuallyHiddenText, { children: ` ${t('read_only')}` })] })] }), labelAs: card ? 'div' : undefined, id: id, required: required, disabled: disabled, readOnly: readOnly, status: status, info: info, isRadioCheck: true, inline: true, labelAfter: true, additionalInfo: additionalInfo, children: _jsx(StyledRadioCheckInput, { ...restProps, id: id, type: type, required: required, disabled: disabled, readOnly: readOnly, onClick: (e) => {
+    return (_jsx(FormField, { as: card ? StyledRadioCheckCard : StyledRadioCheck, label: _jsxs(_Fragment, { children: [_jsx(StyledPseudoRadioCheck, { status: status, isRadio: isRadio, as: StyledFormControl, required: required, disabled: disabled, readOnly: readOnly, onMouseDown: (e) => {
+                        e.preventDefault();
+                    } }), _jsxs(_Fragment, { children: [label, readOnly && _jsx(VisuallyHiddenText, { children: ` ${t('read_only')}` })] })] }), labelAs: card ? 'div' : undefined, id: id, required: required, disabled: disabled, readOnly: readOnly, status: status, info: info, isRadioCheck: true, inline: true, labelAfter: true, additionalInfo: additionalInfo, children: _jsx(StyledRadioCheckInput, { ...restProps, id: id, type: type, required: required, disabled: disabled, readOnly: readOnly, onClick: (e) => {
                 if (readOnly)
                     e.preventDefault();
                 onClick?.(e);

package/lib/components/RadioCheck/RadioCheck.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioCheck.js","sourceRoot":"","sources":["../../../src/components/RadioCheck/RadioCheck.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useEffect } from 'react';\nimport type {\n  FC,\n  Ref,\n  MouseEvent,\n  KeyboardEvent,\n  PropsWithoutRef,\n  MouseEventHandler,\n  KeyboardEventHandler\n} from 'react';\nimport styled, { css } from 'styled-components';\nimport { readableColor, hideVisually, mix } from 'polished';\n\nimport FormField, { StyledFormFieldInfo } from '../FormField';\nimport { StyledFormControl } from '../FormControl';\nimport type { FormControlProps } from '../FormControl';\nimport { defaultThemeProp } from '../../theme';\nimport { tryCatch } from '../../utils';\nimport type { BaseProps, ForwardProps, NoChildrenProp } from '../../types';\nimport { useConsolidatedRef, useDirection, useI18n, useUID } from '../../hooks';\nimport { StyledLabel } from '../Label';\nimport { calculateFontSize } from '../../styles';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\n\nexport interface RadioCheckProps extends BaseProps, NoChildrenProp {\n  /**\n   * Sets DOM id for the control and associates label element via 'for' attribute.\n   * If an id is not pass, a random id will be generated for any render.\n   */\n  id?: FormControlProps['id'];\n  /** Pass a string or a fragment with an Icon and string. */\n  label?: FormControlProps['label'];\n  /** Indicate if the field is required. The browser defaults to false. */\n  required?: FormControlProps['required'];\n  /** Disable the control. The browser defaults to false. */\n  disabled?: FormControlProps['disabled'];\n  /** Makes the input non editable and non clickable. The browser defaults to false. */\n  readOnly?: FormControlProps['readOnly'];\n  /** Set visual state based on a validation state. */\n  status?: FormControlProps['status'];\n  /** Sets html name attribute for the underlying control. Useful for mapping to a data field. */\n  name?: FormControlProps['name'];\n  /** Sets the type of input. */\n  type: 'radio' | 'checkbox';\n  /** Sets checked prop via onChange when using as controlled component. */\n  checked?: boolean;\n  /** Initialize checked prop when using as uncontrolled component. */\n  defaultChecked?: boolean;\n  /**\n   * Sets control to an an indeterminate state.\n   * @default false\n   */\n  indeterminate?: boolean;\n  /**\n   * Controls the styling of the RadioCheck.\n   * @default 'simple'\n   */\n  variant?: 'simple' | 'card';\n  /** Callback function for onClick events. */\n  onClick?: MouseEventHandler<HTMLInputElement>;\n  /** Callback function for onKeyDown events. */\n  onKeyDown?: KeyboardEventHandler<HTMLInputElement>;\n  /** Pass a heading and content to show additional information on the field. */\n  additionalInfo?: FormControlProps['additionalInfo'];\n  /** info like error, success, warning messages */\n  info?: FormControlProps['info'];\n  /** Ref forwarded to the underlying input. */\n  ref?: Ref<HTMLInputElement>;\n}\n\nexport const StyledPseudoRadioCheck = styled.div<Pick<RadioCheckProps, 'readOnly' | 'status'>>(\n  props => {\n    const {\n      theme: {\n        base: {\n          spacing,\n          palette: { 'primary-background': primaryBackground }\n        },\n        components: {\n          'form-field': formField,\n          'radio-check': {\n            size,\n            'touch-size': touchSize,\n            'background-color': backgroundColor,\n            'border-color': borderColor,\n            'border-width': borderWidth\n          }\n        }\n      },\n      status\n    } = props;\n\n    const useBorderColor = status === 'error' ? formField.error['status-color'] : borderColor;\n    const useBackgroundColor =\n      status && formField[status]\n        ? tryCatch(() => mix(0.8, primaryBackground, formField[status]['status-color']))\n        : backgroundColor;\n\n    return css`\n      display: flex;\n      flex-shrink: 0;\n      position: relative;\n      width: ${size};\n      height: ${size};\n      margin-inline-end: ${spacing};\n      border: ${borderWidth} solid ${useBorderColor};\n      background-color: ${useBackgroundColor};\n\n      @media (pointer: coarse) {\n        width: ${touchSize};\n        height: ${touchSize};\n      }\n\n      &::after {\n        content: '';\n        display: none;\n      }\n    `;\n  }\n);\n\nStyledPseudoRadioCheck.defaultProps = defaultThemeProp;\n\nexport const StyledRadioCheckInput = styled.input(props => {\n  const {\n    disabled,\n    theme: {\n      base: { 'border-radius': baseBorderRadius },\n      components: {\n        'form-control': {\n          ':focus': { 'box-shadow': shadow, 'border-color': focusBorderColor },\n          ':read-only': { 'background-color': readOnlyBackgroundColor }\n        },\n        'radio-check': {\n          size,\n          ':checked': {\n            'background-color': checkedBackgroundColor,\n            'border-color': checkedBorderColor\n          }\n        },\n        checkbox: { 'border-radius': checkRadius },\n        'radio-button': { 'border-radius': radioRadius }\n      }\n    }\n  } = props;\n\n  const backgroundColor = props.readOnly ? readOnlyBackgroundColor : checkedBackgroundColor;\n  const foreground = tryCatch(() => readableColor(backgroundColor));\n\n  const prcSelector = `+ ${StyledLabel} ${StyledPseudoRadioCheck}`;\n  const { ltr } = useDirection();\n\n  return css`\n    ${hideVisually}\n    margin: 0;\n\n    /* Sets rect size for JAWS focus outline */\n    width: ${size};\n    height: ${size};\n\n    ${!disabled &&\n    css`\n      &:focus ${prcSelector} {\n        box-shadow: ${shadow};\n        border-color: ${focusBorderColor};\n      }\n    `}\n\n    &:checked\n      ${prcSelector},\n      &:checked:disabled\n      ${prcSelector},\n      &[type='checkbox']:indeterminate\n      ${prcSelector},\n      &[type='checkbox']:indeterminate:disabled\n      ${prcSelector} {\n      border-color: ${props.readOnly ? 'inherit' : checkedBorderColor};\n      background-color: ${backgroundColor};\n\n      &::after {\n        display: block;\n      }\n    }\n\n    &[type='radio'] ${prcSelector}, &[type='radio'] ${prcSelector}::after {\n      border-radius: ${radioRadius};\n    }\n\n    &[type='radio'] ${prcSelector}::after {\n      margin: auto;\n      width: 100%;\n      height: 100%;\n      background-color: ${foreground};\n      transform: scale(0.4);\n    }\n\n    &[type='checkbox'] ${prcSelector} {\n      border-radius: min(calc(${baseBorderRadius} * ${checkRadius}), 0.25rem);\n    }\n\n    &[type='checkbox']:not(:indeterminate) ${prcSelector} {\n      &::after {\n        width: 40%;\n        height: 75%;\n        ${ltr\n          ? css`\n              transform: rotate(45deg) translate(50%, -30%);\n            `\n          : css`\n              transform: rotate(45deg) translate(-50%, 30%);\n            `}\n        border-right: 0.15em solid ${foreground};\n        border-bottom: 0.15em solid ${foreground};\n      }\n    }\n\n    &[type='checkbox']:indeterminate ${prcSelector} {\n      display: flex;\n      &::after {\n        width: 90%;\n        height: 0.15em;\n        margin: auto;\n        background-color: ${foreground};\n      }\n    }\n  `;\n});\n\nStyledRadioCheckInput.defaultProps = defaultThemeProp;\n\nexport const StyledRadioCheck = styled.div<Pick<RadioCheckProps, 'disabled' | 'readOnly'>>(\n  props => {\n    const {\n      disabled,\n      readOnly,\n      theme: {\n        base,\n        components: {\n          'radio-check': {\n            label: { color: labelColor, 'font-weight': labelFontWeight }\n          },\n          'form-control': {\n            ':hover': { 'border-color': hoverBorderColor }\n          }\n        }\n      }\n    } = props;\n\n    const fontSize = calculateFontSize(base['font-size'], base['font-scale']);\n\n    return css`\n      > ${StyledLabel} {\n        cursor: pointer;\n        display: flex;\n        align-items: center;\n        font-weight: ${labelFontWeight};\n        word-break: break-word;\n        font-size: ${fontSize.s};\n        color: ${labelColor};\n        margin: 0;\n        min-height: ${base['hit-area']['mouse-min']};\n\n        @media (pointer: coarse) {\n          min-height: ${base['hit-area']['finger-min']};\n        }\n      }\n\n      > ${StyledFormFieldInfo} {\n        margin: 0;\n        padding-inline-start: calc(${base.spacing} / 4);\n      }\n\n      ${!(disabled || readOnly) &&\n      css`\n        &:not(:focus-within) > ${StyledLabel}:hover ${StyledPseudoRadioCheck} {\n          border-color: ${hoverBorderColor};\n        }\n      `}\n    `;\n  }\n);\n\nStyledRadioCheck.defaultProps = defaultThemeProp;\n\nexport const StyledRadioCheckCard = styled.label<\n  Pick<RadioCheckProps, 'disabled' | 'readOnly' | 'status'>\n>(\n  ({\n    disabled,\n    readOnly,\n    status,\n    theme: {\n      base: { palette, shadow, spacing },\n      components: {\n        card,\n        'form-field': formField,\n        'radio-check': { label },\n        'form-control': {\n          ':hover': { 'border-color': hoverBorderColor }\n        }\n      }\n    }\n  }) => {\n    const useBorderColor =\n      status === 'error' ? formField.error['status-color'] : palette['border-line'];\n\n    return css`\n      min-width: min-content;\n      cursor: pointer;\n      background-color: ${card.background};\n      border-radius: ${card['border-radius']};\n      border: 0.0625rem solid ${useBorderColor};\n      padding: ${spacing};\n\n      ${disabled &&\n      css`\n        cursor: not-allowed;\n      `}\n\n      ${!(disabled || readOnly) &&\n      css`\n        :hover:not(:focus-within) {\n          border-color: ${hoverBorderColor};\n          ${StyledLabel} ${StyledPseudoRadioCheck} {\n            border-color: ${hoverBorderColor};\n          }\n        }\n\n        :focus-within {\n          box-shadow: ${shadow.focus};\n          border-color: transparent;\n        }\n      `}\n\n    > ${StyledLabel} {\n        display: flex;\n        align-items: center;\n        color: ${label.color};\n        font-weight: ${label['font-weight']};\n        margin: 0;\n      }\n\n      > ${StyledFormFieldInfo} {\n        margin: 0;\n        padding-inline-start: calc(${spacing} / 4);\n      }\n    `;\n  }\n);\n\nStyledRadioCheckCard.defaultProps = defaultThemeProp;\n\nconst RadioCheck: FC<RadioCheckProps & ForwardProps> = forwardRef(function RadioCheck(\n  props: PropsWithoutRef<RadioCheckProps>,\n  ref: RadioCheckProps['ref']\n) {\n  const uid = useUID();\n  const t = useI18n();\n\n  const {\n    type,\n    id = uid,\n    label,\n    required = false,\n    disabled = false,\n    indeterminate = false,\n    readOnly = false,\n    variant = 'simple',\n    onClick,\n    onKeyDown,\n    status,\n    info,\n    additionalInfo,\n    ...restProps\n  } = props;\n\n  const isRadio = type === 'radio';\n  const card = variant === 'card';\n  const newRef = useConsolidatedRef(ref);\n\n  useEffect(() => {\n    if (!isRadio && newRef.current) {\n      newRef.current.indeterminate = !!indeterminate;\n    }\n  }, [newRef, indeterminate, isRadio]);\n\n  return (\n    <FormField\n      as={card ? StyledRadioCheckCard : StyledRadioCheck}\n      label={\n        <>\n          <StyledPseudoRadioCheck\n            status={status}\n            isRadio={isRadio}\n            as={StyledFormControl}\n            required={required}\n            disabled={disabled}\n            readOnly={readOnly}\n          />\n          <>\n            {label}\n            {readOnly && <VisuallyHiddenText>{` ${t('read_only')}`}</VisuallyHiddenText>}\n          </>\n        </>\n      }\n      labelAs={card ? 'div' : undefined}\n      id={id}\n      required={required}\n      disabled={disabled}\n      readOnly={readOnly}\n      status={status}\n      info={info}\n      isRadioCheck\n      inline\n      labelAfter\n      additionalInfo={additionalInfo}\n    >\n      <StyledRadioCheckInput\n        {...restProps}\n        id={id}\n        type={type}\n        required={required}\n        disabled={disabled}\n        readOnly={readOnly}\n        onClick={(e: MouseEvent<HTMLInputElement>) => {\n          if (readOnly) e.preventDefault();\n\n          onClick?.(e);\n        }}\n        onKeyDown={(e: KeyboardEvent<HTMLInputElement>) => {\n          if (type === 'checkbox' && readOnly && e.key === ' ') {\n            e.preventDefault();\n          }\n          if (type === 'radio' && readOnly && e.key.includes('Arrow')) {\n            e.preventDefault();\n          }\n\n          onKeyDown?.(e);\n        }}\n        ref={newRef}\n      />\n    </FormField>\n  );\n});\n\nexport default RadioCheck;\n"]}
+{"version":3,"file":"RadioCheck.js","sourceRoot":"","sources":["../../../src/components/RadioCheck/RadioCheck.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useEffect } from 'react';\nimport type {\n  FC,\n  Ref,\n  MouseEvent,\n  KeyboardEvent,\n  PropsWithoutRef,\n  MouseEventHandler,\n  KeyboardEventHandler\n} from 'react';\nimport styled, { css } from 'styled-components';\nimport { readableColor, hideVisually, mix } from 'polished';\n\nimport FormField, { StyledFormFieldInfo } from '../FormField';\nimport { StyledFormControl } from '../FormControl';\nimport type { FormControlProps } from '../FormControl';\nimport { defaultThemeProp } from '../../theme';\nimport { tryCatch } from '../../utils';\nimport type { BaseProps, ForwardProps, NoChildrenProp } from '../../types';\nimport { useConsolidatedRef, useDirection, useI18n, useUID } from '../../hooks';\nimport { StyledLabel } from '../Label';\nimport { calculateFontSize } from '../../styles';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\n\nexport interface RadioCheckProps extends BaseProps, NoChildrenProp {\n  /**\n   * Sets DOM id for the control and associates label element via 'for' attribute.\n   * If an id is not pass, a random id will be generated for any render.\n   */\n  id?: FormControlProps['id'];\n  /** Pass a string or a fragment with an Icon and string. */\n  label?: FormControlProps['label'];\n  /** Indicate if the field is required. The browser defaults to false. */\n  required?: FormControlProps['required'];\n  /** Disable the control. The browser defaults to false. */\n  disabled?: FormControlProps['disabled'];\n  /** Makes the input non editable and non clickable. The browser defaults to false. */\n  readOnly?: FormControlProps['readOnly'];\n  /** Set visual state based on a validation state. */\n  status?: FormControlProps['status'];\n  /** Sets html name attribute for the underlying control. Useful for mapping to a data field. */\n  name?: FormControlProps['name'];\n  /** Sets the type of input. */\n  type: 'radio' | 'checkbox';\n  /** Sets checked prop via onChange when using as controlled component. */\n  checked?: boolean;\n  /** Initialize checked prop when using as uncontrolled component. */\n  defaultChecked?: boolean;\n  /**\n   * Sets control to an an indeterminate state.\n   * @default false\n   */\n  indeterminate?: boolean;\n  /**\n   * Controls the styling of the RadioCheck.\n   * @default 'simple'\n   */\n  variant?: 'simple' | 'card';\n  /** Callback function for onClick events. */\n  onClick?: MouseEventHandler<HTMLInputElement>;\n  /** Callback function for onKeyDown events. */\n  onKeyDown?: KeyboardEventHandler<HTMLInputElement>;\n  /** Pass a heading and content to show additional information on the field. */\n  additionalInfo?: FormControlProps['additionalInfo'];\n  /** info like error, success, warning messages */\n  info?: FormControlProps['info'];\n  /** Ref forwarded to the underlying input. */\n  ref?: Ref<HTMLInputElement>;\n}\n\nexport const StyledPseudoRadioCheck = styled.div<Pick<RadioCheckProps, 'readOnly' | 'status'>>(\n  props => {\n    const {\n      theme: {\n        base: {\n          spacing,\n          palette: { 'primary-background': primaryBackground }\n        },\n        components: {\n          'form-field': formField,\n          'radio-check': {\n            size,\n            'touch-size': touchSize,\n            'background-color': backgroundColor,\n            'border-color': borderColor,\n            'border-width': borderWidth\n          }\n        }\n      },\n      status\n    } = props;\n\n    const useBorderColor = status === 'error' ? formField.error['status-color'] : borderColor;\n    const useBackgroundColor =\n      status && formField[status]\n        ? tryCatch(() => mix(0.8, primaryBackground, formField[status]['status-color']))\n        : backgroundColor;\n\n    return css`\n      display: flex;\n      flex-shrink: 0;\n      position: relative;\n      width: ${size};\n      height: ${size};\n      margin-inline-end: ${spacing};\n      border: ${borderWidth} solid ${useBorderColor};\n      background-color: ${useBackgroundColor};\n\n      @media (pointer: coarse) {\n        width: ${touchSize};\n        height: ${touchSize};\n      }\n\n      &::after {\n        content: '';\n        display: none;\n      }\n    `;\n  }\n);\n\nStyledPseudoRadioCheck.defaultProps = defaultThemeProp;\n\nexport const StyledRadioCheckInput = styled.input(props => {\n  const {\n    disabled,\n    theme: {\n      base: { 'border-radius': baseBorderRadius },\n      components: {\n        'form-control': {\n          ':focus': { 'box-shadow': shadow, 'border-color': focusBorderColor },\n          ':read-only': { 'background-color': readOnlyBackgroundColor }\n        },\n        'radio-check': {\n          size,\n          ':checked': {\n            'background-color': checkedBackgroundColor,\n            'border-color': checkedBorderColor\n          }\n        },\n        checkbox: { 'border-radius': checkRadius },\n        'radio-button': { 'border-radius': radioRadius }\n      }\n    }\n  } = props;\n\n  const backgroundColor = props.readOnly ? readOnlyBackgroundColor : checkedBackgroundColor;\n  const foreground = tryCatch(() => readableColor(backgroundColor));\n\n  const prcSelector = `+ ${StyledLabel} ${StyledPseudoRadioCheck}`;\n  const { ltr } = useDirection();\n\n  return css`\n    ${hideVisually}\n    margin: 0;\n\n    /* Sets rect size for JAWS focus outline */\n    width: ${size};\n    height: ${size};\n\n    ${!disabled &&\n    css`\n      &:focus ${prcSelector} {\n        box-shadow: ${shadow};\n        border-color: ${focusBorderColor};\n      }\n    `}\n\n    &:checked\n      ${prcSelector},\n      &:checked:disabled\n      ${prcSelector},\n      &[type='checkbox']:indeterminate\n      ${prcSelector},\n      &[type='checkbox']:indeterminate:disabled\n      ${prcSelector} {\n      border-color: ${props.readOnly ? 'inherit' : checkedBorderColor};\n      background-color: ${backgroundColor};\n\n      &::after {\n        display: block;\n      }\n    }\n\n    &[type='radio'] ${prcSelector}, &[type='radio'] ${prcSelector}::after {\n      border-radius: ${radioRadius};\n    }\n\n    &[type='radio'] ${prcSelector}::after {\n      margin: auto;\n      width: 100%;\n      height: 100%;\n      background-color: ${foreground};\n      transform: scale(0.4);\n    }\n\n    &[type='checkbox'] ${prcSelector} {\n      border-radius: min(calc(${baseBorderRadius} * ${checkRadius}), 0.25rem);\n    }\n\n    &[type='checkbox']:not(:indeterminate) ${prcSelector} {\n      &::after {\n        width: 40%;\n        height: 75%;\n        ${ltr\n          ? css`\n              transform: rotate(45deg) translate(50%, -30%);\n            `\n          : css`\n              transform: rotate(45deg) translate(-50%, 30%);\n            `}\n        border-right: 0.15em solid ${foreground};\n        border-bottom: 0.15em solid ${foreground};\n      }\n    }\n\n    &[type='checkbox']:indeterminate ${prcSelector} {\n      display: flex;\n      &::after {\n        width: 90%;\n        height: 0.15em;\n        margin: auto;\n        background-color: ${foreground};\n      }\n    }\n  `;\n});\n\nStyledRadioCheckInput.defaultProps = defaultThemeProp;\n\nexport const StyledRadioCheck = styled.div<Pick<RadioCheckProps, 'disabled' | 'readOnly'>>(\n  props => {\n    const {\n      disabled,\n      readOnly,\n      theme: {\n        base,\n        components: {\n          'radio-check': {\n            label: { color: labelColor, 'font-weight': labelFontWeight }\n          },\n          'form-control': {\n            ':hover': { 'border-color': hoverBorderColor }\n          }\n        }\n      }\n    } = props;\n\n    const fontSize = calculateFontSize(base['font-size'], base['font-scale']);\n\n    return css`\n      > ${StyledLabel} {\n        cursor: pointer;\n        display: flex;\n        align-items: center;\n        font-weight: ${labelFontWeight};\n        word-break: break-word;\n        font-size: ${fontSize.s};\n        color: ${labelColor};\n        margin: 0;\n        min-height: ${base['hit-area']['mouse-min']};\n\n        @media (pointer: coarse) {\n          min-height: ${base['hit-area']['finger-min']};\n        }\n      }\n\n      > ${StyledFormFieldInfo} {\n        margin: 0;\n        padding-inline-start: calc(${base.spacing} / 4);\n      }\n\n      ${!(disabled || readOnly) &&\n      css`\n        &:not(:focus-within) > ${StyledLabel}:hover ${StyledPseudoRadioCheck} {\n          border-color: ${hoverBorderColor};\n        }\n      `}\n    `;\n  }\n);\n\nStyledRadioCheck.defaultProps = defaultThemeProp;\n\nexport const StyledRadioCheckCard = styled.label<\n  Pick<RadioCheckProps, 'disabled' | 'readOnly' | 'status'>\n>(\n  ({\n    disabled,\n    readOnly,\n    status,\n    theme: {\n      base: { palette, shadow, spacing },\n      components: {\n        card,\n        'form-field': formField,\n        'radio-check': { label },\n        'form-control': {\n          ':hover': { 'border-color': hoverBorderColor }\n        }\n      }\n    }\n  }) => {\n    const useBorderColor =\n      status === 'error' ? formField.error['status-color'] : palette['border-line'];\n\n    return css`\n      min-width: min-content;\n      cursor: pointer;\n      background-color: ${card.background};\n      border-radius: ${card['border-radius']};\n      border: 0.0625rem solid ${useBorderColor};\n      padding: ${spacing};\n\n      ${disabled &&\n      css`\n        cursor: not-allowed;\n      `}\n\n      ${!(disabled || readOnly) &&\n      css`\n        :hover:not(:focus-within) {\n          border-color: ${hoverBorderColor};\n          ${StyledLabel} ${StyledPseudoRadioCheck} {\n            border-color: ${hoverBorderColor};\n          }\n        }\n\n        :focus-within {\n          box-shadow: ${shadow.focus};\n          border-color: transparent;\n        }\n      `}\n\n    > ${StyledLabel} {\n        display: flex;\n        align-items: center;\n        color: ${label.color};\n        font-weight: ${label['font-weight']};\n        margin: 0;\n      }\n\n      > ${StyledFormFieldInfo} {\n        margin: 0;\n        padding-inline-start: calc(${spacing} / 4);\n      }\n    `;\n  }\n);\n\nStyledRadioCheckCard.defaultProps = defaultThemeProp;\n\nconst RadioCheck: FC<RadioCheckProps & ForwardProps> = forwardRef(function RadioCheck(\n  props: PropsWithoutRef<RadioCheckProps>,\n  ref: RadioCheckProps['ref']\n) {\n  const uid = useUID();\n  const t = useI18n();\n\n  const {\n    type,\n    id = uid,\n    label,\n    required = false,\n    disabled = false,\n    indeterminate = false,\n    readOnly = false,\n    variant = 'simple',\n    onClick,\n    onKeyDown,\n    status,\n    info,\n    additionalInfo,\n    ...restProps\n  } = props;\n\n  const isRadio = type === 'radio';\n  const card = variant === 'card';\n  const newRef = useConsolidatedRef(ref);\n\n  useEffect(() => {\n    if (!isRadio && newRef.current) {\n      newRef.current.indeterminate = !!indeterminate;\n    }\n  }, [newRef, indeterminate, isRadio]);\n\n  return (\n    <FormField\n      as={card ? StyledRadioCheckCard : StyledRadioCheck}\n      label={\n        <>\n          <StyledPseudoRadioCheck\n            status={status}\n            isRadio={isRadio}\n            as={StyledFormControl}\n            required={required}\n            disabled={disabled}\n            readOnly={readOnly}\n            onMouseDown={(e: MouseEvent<HTMLInputElement>) => {\n              e.preventDefault();\n            }}\n          />\n          <>\n            {label}\n            {readOnly && <VisuallyHiddenText>{` ${t('read_only')}`}</VisuallyHiddenText>}\n          </>\n        </>\n      }\n      labelAs={card ? 'div' : undefined}\n      id={id}\n      required={required}\n      disabled={disabled}\n      readOnly={readOnly}\n      status={status}\n      info={info}\n      isRadioCheck\n      inline\n      labelAfter\n      additionalInfo={additionalInfo}\n    >\n      <StyledRadioCheckInput\n        {...restProps}\n        id={id}\n        type={type}\n        required={required}\n        disabled={disabled}\n        readOnly={readOnly}\n        onClick={(e: MouseEvent<HTMLInputElement>) => {\n          if (readOnly) e.preventDefault();\n\n          onClick?.(e);\n        }}\n        onKeyDown={(e: KeyboardEvent<HTMLInputElement>) => {\n          if (type === 'checkbox' && readOnly && e.key === ' ') {\n            e.preventDefault();\n          }\n          if (type === 'radio' && readOnly && e.key.includes('Arrow')) {\n            e.preventDefault();\n          }\n\n          onKeyDown?.(e);\n        }}\n        ref={newRef}\n      />\n    </FormField>\n  );\n});\n\nexport default RadioCheck;\n"]}

package/lib/components/SearchInput/SearchInput.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SearchInput.styles.d.ts","sourceRoot":"","sources":["../../../src/components/SearchInput/SearchInput.styles.ts"],"names":[],"mappings":"AAUA,eAAO,MAAM,kBAAkB,oNAM7B,CAAC;AAIH,eAAO,MAAM,gBAAgB;;uDA0B5B,CAAC;AAIF,eAAO,MAAM,kBAAkB,qMAW7B,CAAC;AAIH,eAAO,MAAM,qBAAqB;;;eAA8B,OAAO;SA+CrE,CAAC;AAIH,eAAO,MAAM,iBAAiB;gBAA4B,OAAO;SA+BhE,CAAC;AAIF,eAAO,MAAM,gBAAgB,yGAI5B,CAAC;AAEF,eAAO,MAAM,4BAA4B,yGAExC,CAAC;AAIF,eAAO,MAAM,oBAAoB,yGAAe,CAAC;AAEjD,eAAO,MAAM,oBAAoB,yGAAe,CAAC"}
+{"version":3,"file":"SearchInput.styles.d.ts","sourceRoot":"","sources":["../../../src/components/SearchInput/SearchInput.styles.ts"],"names":[],"mappings":"AAUA,eAAO,MAAM,kBAAkB,oNAU7B,CAAC;AAIH,eAAO,MAAM,gBAAgB;;uDA0B5B,CAAC;AAIF,eAAO,MAAM,kBAAkB,qMAiB7B,CAAC;AAIH,eAAO,MAAM,qBAAqB;;;eAA8B,OAAO;SA+CrE,CAAC;AAIH,eAAO,MAAM,iBAAiB;gBAA4B,OAAO;SAoChE,CAAC;AAIF,eAAO,MAAM,gBAAgB,yGAI5B,CAAC;AAEF,eAAO,MAAM,4BAA4B,yGAExC,CAAC;AAIF,eAAO,MAAM,oBAAoB,yGAAe,CAAC;AAEjD,eAAO,MAAM,oBAAoB,yGAAe,CAAC"}

package/lib/components/SearchInput/SearchInput.styles.js

@@ -11,6 +11,10 @@ export const StyledSearchButton = styled(BareButton)(({ theme: { base } }) => {
     return css `
     padding-inline-start: ${base.spacing};
     color: ${iconColor};
+
+    @media (pointer: coarse) {
+      padding-inline-start: calc(3 * ${base.spacing});
+    }
   `;
 });
 StyledSearchButton.defaultProps = defaultThemeProp;
@@ -45,6 +49,12 @@ export const StyledCancelButton = styled(Button)(({ theme }) => {
       (${theme.components.input.height} - ${theme.base['hit-area'].compact}) / 2
     );
     z-index: 3;
+
+    @media (pointer: coarse) {
+      inset-block-start: calc(
+        (${theme.base['hit-area']['finger-min']} - ${theme.base['hit-area'].compact}) / 2
+      );
+    }
   `;
 });
 StyledCancelButton.defaultProps = defaultThemeProp;
@@ -119,6 +129,11 @@ export const StyledSearchInput = styled.div(({ theme: { base, components: { inpu
           box-shadow: ${formControl[':focus']['box-shadow']};
         }
       `}
+
+      @media (pointer: coarse) {
+        min-height: ${base['hit-area']['finger-min']};
+        min-width: ${base['hit-area']['finger-min']};
+      }
     `;
 });
 StyledSearchInput.defaultProps = defaultThemeProp;

package/lib/components/SearchInput/SearchInput.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchInput.styles.js","sourceRoot":"","sources":["../../../src/components/SearchInput/SearchInput.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import { transparentize } from 'polished';\nimport styled, { css } from 'styled-components';\n\nimport MenuButton from '../MenuButton';\nimport { defaultThemeProp } from '../../theme';\nimport { tryCatch } from '../../utils';\nimport Button from '../Button';\nimport BareButton from '../Button/BareButton';\nimport Input from '../Input';\n\nexport const StyledSearchButton = styled(BareButton)(({ theme: { base } }) => {\n  const iconColor = tryCatch(() => transparentize(0.3, base.palette['foreground-color']));\n  return css`\n    padding-inline-start: ${base.spacing};\n    color: ${iconColor};\n  `;\n});\n\nStyledSearchButton.defaultProps = defaultThemeProp;\n\nexport const StyledMenuButton = styled(MenuButton)(\n  ({\n    theme: {\n      base,\n      components: { 'search-input': searchInput, 'form-control': formControl, input }\n    }\n  }) => {\n    const iconColor = tryCatch(() => transparentize(0.3, base.palette['foreground-color']));\n    return css`\n      border-start-start-radius: calc(${base['border-radius']} * ${searchInput['border-radius']});\n      border-end-start-radius: calc(${base['border-radius']} * ${searchInput['border-radius']});\n      padding-inline-start: ${base.spacing};\n      border: ${input['border-width']} solid ${input['border-color']};\n      color: ${iconColor};\n      position: relative;\n      z-index: 2;\n      &:hover {\n        text-decoration: none;\n      }\n\n      &:focus:enabled {\n        border-color: ${formControl[':focus']['border-color']};\n        box-shadow: ${formControl[':focus']['box-shadow']};\n      }\n    `;\n  }\n);\n\nStyledMenuButton.defaultProps = defaultThemeProp;\n\nexport const StyledCancelButton = styled(Button)(({ theme }) => {\n  return css`\n    position: absolute;\n    inset-inline-end: calc(\n      (${theme.base['hit-area'].finger} - ${theme.base['hit-area'].compact}) / 2\n    );\n    inset-block-start: calc(\n      (${theme.components.input.height} - ${theme.base['hit-area'].compact}) / 2\n    );\n    z-index: 3;\n  `;\n});\n\nStyledCancelButton.defaultProps = defaultThemeProp;\n\nexport const StyledSearchTextInput = styled(Input)<{ decoupled: boolean }>(props => {\n  const { theme, decoupled } = props;\n  const comp = theme.components['search-input'];\n  return css`\n    flex: 1;\n    background: transparent;\n    padding-inline-end: calc(${theme.base['hit-area'].finger});\n    border-radius: calc(${comp['border-radius']} * ${theme.base['border-radius']});\n    border-start-start-radius: 0;\n    border-end-start-radius: 0;\n    ${decoupled\n      ? css`\n          border-inline-start: none;\n        `\n      : css`\n          border: none;\n        `}\n    height: 100%;\n    min-height: 100%;\n    position: relative;\n    z-index: 1;\n\n    &[value=''] {\n      padding-inline-end: 0;\n    }\n\n    &::-ms-clear {\n      display: none;\n    }\n\n    &::-webkit-search-cancel-button {\n      display: none;\n    }\n\n    ::-webkit-search-decoration {\n      -webkit-appearance: none;\n    }\n\n    &:focus:not([disabled]) {\n      z-index: 2;\n      ${!decoupled &&\n      css`\n        border: none;\n        box-shadow: none;\n      `}\n    }\n  `;\n});\n\nStyledSearchTextInput.defaultProps = defaultThemeProp;\n\nexport const StyledSearchInput = styled.div<{ hasFilters: boolean }>(\n  ({\n    theme: {\n      base,\n      components: { input, 'form-control': formControl, 'search-input': searchInput }\n    },\n    hasFilters\n  }) => {\n    return css`\n      background: ${formControl['background-color']};\n      min-height: ${input.height};\n      position: relative;\n      height: ${input.height};\n      border-radius: calc(${searchInput['border-radius']} * ${base['border-radius']});\n      ${hasFilters\n        ? css`\n            border: none;\n          `\n        : css`\n            border: ${input['border-width']} solid ${input['border-color']};\n          `}\n\n      ${!hasFilters &&\n      css`\n        :focus-within {\n          border-color: ${base.palette.light};\n          box-shadow: ${formControl[':focus']['box-shadow']};\n        }\n      `}\n    `;\n  }\n);\n\nStyledSearchInput.defaultProps = defaultThemeProp;\n\nexport const StyledSearchMenu = styled.div`\n  header {\n    border-bottom: none;\n  }\n`;\n\nexport const StyledSearchResultsContainer = styled.div`\n  padding-top: ${props => props.theme.base.spacing};\n`;\n\nStyledSearchResultsContainer.defaultProps = defaultThemeProp;\n\nexport const StyledFiltersPopover = styled.div``;\n\nexport const StyledResultsPopover = styled.div``;\n"]}
+{"version":3,"file":"SearchInput.styles.js","sourceRoot":"","sources":["../../../src/components/SearchInput/SearchInput.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import { transparentize } from 'polished';\nimport styled, { css } from 'styled-components';\n\nimport MenuButton from '../MenuButton';\nimport { defaultThemeProp } from '../../theme';\nimport { tryCatch } from '../../utils';\nimport Button from '../Button';\nimport BareButton from '../Button/BareButton';\nimport Input from '../Input';\n\nexport const StyledSearchButton = styled(BareButton)(({ theme: { base } }) => {\n  const iconColor = tryCatch(() => transparentize(0.3, base.palette['foreground-color']));\n  return css`\n    padding-inline-start: ${base.spacing};\n    color: ${iconColor};\n\n    @media (pointer: coarse) {\n      padding-inline-start: calc(3 * ${base.spacing});\n    }\n  `;\n});\n\nStyledSearchButton.defaultProps = defaultThemeProp;\n\nexport const StyledMenuButton = styled(MenuButton)(\n  ({\n    theme: {\n      base,\n      components: { 'search-input': searchInput, 'form-control': formControl, input }\n    }\n  }) => {\n    const iconColor = tryCatch(() => transparentize(0.3, base.palette['foreground-color']));\n    return css`\n      border-start-start-radius: calc(${base['border-radius']} * ${searchInput['border-radius']});\n      border-end-start-radius: calc(${base['border-radius']} * ${searchInput['border-radius']});\n      padding-inline-start: ${base.spacing};\n      border: ${input['border-width']} solid ${input['border-color']};\n      color: ${iconColor};\n      position: relative;\n      z-index: 2;\n      &:hover {\n        text-decoration: none;\n      }\n\n      &:focus:enabled {\n        border-color: ${formControl[':focus']['border-color']};\n        box-shadow: ${formControl[':focus']['box-shadow']};\n      }\n    `;\n  }\n);\n\nStyledMenuButton.defaultProps = defaultThemeProp;\n\nexport const StyledCancelButton = styled(Button)(({ theme }) => {\n  return css`\n    position: absolute;\n    inset-inline-end: calc(\n      (${theme.base['hit-area'].finger} - ${theme.base['hit-area'].compact}) / 2\n    );\n    inset-block-start: calc(\n      (${theme.components.input.height} - ${theme.base['hit-area'].compact}) / 2\n    );\n    z-index: 3;\n\n    @media (pointer: coarse) {\n      inset-block-start: calc(\n        (${theme.base['hit-area']['finger-min']} - ${theme.base['hit-area'].compact}) / 2\n      );\n    }\n  `;\n});\n\nStyledCancelButton.defaultProps = defaultThemeProp;\n\nexport const StyledSearchTextInput = styled(Input)<{ decoupled: boolean }>(props => {\n  const { theme, decoupled } = props;\n  const comp = theme.components['search-input'];\n  return css`\n    flex: 1;\n    background: transparent;\n    padding-inline-end: calc(${theme.base['hit-area'].finger});\n    border-radius: calc(${comp['border-radius']} * ${theme.base['border-radius']});\n    border-start-start-radius: 0;\n    border-end-start-radius: 0;\n    ${decoupled\n      ? css`\n          border-inline-start: none;\n        `\n      : css`\n          border: none;\n        `}\n    height: 100%;\n    min-height: 100%;\n    position: relative;\n    z-index: 1;\n\n    &[value=''] {\n      padding-inline-end: 0;\n    }\n\n    &::-ms-clear {\n      display: none;\n    }\n\n    &::-webkit-search-cancel-button {\n      display: none;\n    }\n\n    ::-webkit-search-decoration {\n      -webkit-appearance: none;\n    }\n\n    &:focus:not([disabled]) {\n      z-index: 2;\n      ${!decoupled &&\n      css`\n        border: none;\n        box-shadow: none;\n      `}\n    }\n  `;\n});\n\nStyledSearchTextInput.defaultProps = defaultThemeProp;\n\nexport const StyledSearchInput = styled.div<{ hasFilters: boolean }>(\n  ({\n    theme: {\n      base,\n      components: { input, 'form-control': formControl, 'search-input': searchInput }\n    },\n    hasFilters\n  }) => {\n    return css`\n      background: ${formControl['background-color']};\n      min-height: ${input.height};\n      position: relative;\n      height: ${input.height};\n      border-radius: calc(${searchInput['border-radius']} * ${base['border-radius']});\n      ${hasFilters\n        ? css`\n            border: none;\n          `\n        : css`\n            border: ${input['border-width']} solid ${input['border-color']};\n          `}\n\n      ${!hasFilters &&\n      css`\n        :focus-within {\n          border-color: ${base.palette.light};\n          box-shadow: ${formControl[':focus']['box-shadow']};\n        }\n      `}\n\n      @media (pointer: coarse) {\n        min-height: ${base['hit-area']['finger-min']};\n        min-width: ${base['hit-area']['finger-min']};\n      }\n    `;\n  }\n);\n\nStyledSearchInput.defaultProps = defaultThemeProp;\n\nexport const StyledSearchMenu = styled.div`\n  header {\n    border-bottom: none;\n  }\n`;\n\nexport const StyledSearchResultsContainer = styled.div`\n  padding-top: ${props => props.theme.base.spacing};\n`;\n\nStyledSearchResultsContainer.defaultProps = defaultThemeProp;\n\nexport const StyledFiltersPopover = styled.div``;\n\nexport const StyledResultsPopover = styled.div``;\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pega/cosmos-react-core",
-  "version": "5.0.0-dev.10.4",
+  "version": "5.0.0-dev.10.6",
   "description": "Cosmos is a visual design system and UI component collection. Its goal is to empower application developers in their pursuit to create engaging and rewarding user experiences.",
   "repository": {
     "type": "git",