@pega/cosmos-react-core 7.4.7 → 7.5.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/components/AppShell/AppShell.d.ts.map +1 -1
- package/lib/components/AppShell/AppShell.js +1 -1
- package/lib/components/AppShell/AppShell.js.map +1 -1
- package/lib/components/Currency/CurrencyInput.d.ts.map +1 -1
- package/lib/components/Currency/CurrencyInput.js +7 -7
- package/lib/components/Currency/CurrencyInput.js.map +1 -1
- package/lib/components/Currency/CurrencyInput.styles.d.ts +5 -0
- package/lib/components/Currency/CurrencyInput.styles.d.ts.map +1 -0
- package/lib/components/Currency/CurrencyInput.styles.js +13 -0
- package/lib/components/Currency/CurrencyInput.styles.js.map +1 -0
- package/lib/components/Currency/CurrencyInput.types.d.ts +1 -1
- package/lib/components/Currency/CurrencyInput.types.d.ts.map +1 -1
- package/lib/components/Currency/CurrencyInput.types.js.map +1 -1
- package/lib/components/Currency/utils.d.ts.map +1 -1
- package/lib/components/Currency/utils.js +2 -1
- package/lib/components/Currency/utils.js.map +1 -1
- package/lib/components/DateTime/Input/DateTime.styles.d.ts.map +1 -1
- package/lib/components/DateTime/Input/DateTime.styles.js +5 -2
- package/lib/components/DateTime/Input/DateTime.styles.js.map +1 -1
- package/lib/components/DateTime/Input/utils.d.ts +1 -0
- package/lib/components/DateTime/Input/utils.d.ts.map +1 -1
- package/lib/components/DateTime/Input/utils.js +14 -14
- package/lib/components/DateTime/Input/utils.js.map +1 -1
- package/lib/components/DateTime/Picker/DatePicker.d.ts.map +1 -1
- package/lib/components/DateTime/Picker/DatePicker.js +5 -3
- package/lib/components/DateTime/Picker/DatePicker.js.map +1 -1
- package/lib/components/DateTime/Picker/utils.d.ts +1 -0
- package/lib/components/DateTime/Picker/utils.d.ts.map +1 -1
- package/lib/components/DateTime/Picker/utils.js +7 -0
- package/lib/components/DateTime/Picker/utils.js.map +1 -1
- package/lib/components/Menu/FlyoutMenuList.js +1 -1
- package/lib/components/Menu/FlyoutMenuList.js.map +1 -1
- package/lib/components/Menu/Menu.js +2 -2
- package/lib/components/Menu/Menu.js.map +1 -1
- package/lib/components/Modal/Modal.d.ts.map +1 -1
- package/lib/components/Modal/Modal.js +2 -2
- package/lib/components/Modal/Modal.js.map +1 -1
- package/lib/components/Modal/Modal.styles.d.ts +1 -1
- package/lib/components/Modal/Modal.styles.d.ts.map +1 -1
- package/lib/components/Modal/Modal.types.d.ts +6 -1
- package/lib/components/Modal/Modal.types.d.ts.map +1 -1
- package/lib/components/Modal/Modal.types.js.map +1 -1
- package/lib/components/Number/NumberInput.d.ts.map +1 -1
- package/lib/components/Number/NumberInput.js +8 -8
- package/lib/components/Number/NumberInput.js.map +1 -1
- package/lib/components/Number/NumberInput.styles.d.ts.map +1 -1
- package/lib/components/Number/NumberInput.styles.js +12 -0
- package/lib/components/Number/NumberInput.styles.js.map +1 -1
- package/lib/components/Number/utils.d.ts +2 -2
- package/lib/components/Number/utils.d.ts.map +1 -1
- package/lib/components/Number/utils.js +4 -2
- package/lib/components/Number/utils.js.map +1 -1
- package/lib/hooks/useI18n.d.ts +20 -0
- package/lib/hooks/useI18n.d.ts.map +1 -1
- package/lib/i18n/default.d.ts +20 -0
- package/lib/i18n/default.d.ts.map +1 -1
- package/lib/i18n/default.js +20 -0
- package/lib/i18n/default.js.map +1 -1
- package/lib/i18n/i18n.d.ts +20 -0
- package/lib/i18n/i18n.d.ts.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../../src/components/Modal/Modal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useEffect, useRef, useCallback, useState } from 'react';\nimport type {\n FunctionComponent,\n PropsWithoutRef,\n Ref,\n MouseEvent,\n KeyboardEvent as ReactKeyboardEvent\n} from 'react';\n\nimport Progress, { type ProgressProps } from '../Progress';\nimport { getFocusables } from '../../utils';\nimport Backdrop from '../Backdrop';\nimport Flex from '../Flex';\nimport Button from '../Button';\nimport type { ForwardProps } from '../../types';\nimport {\n useConsolidatedRef,\n useI18n,\n useOuterEvent,\n useUID,\n useFocusTrap,\n usePrevious,\n useModalContext,\n useEvent,\n useBreakpoint\n} from '../../hooks';\nimport Icon, { registerIcon } from '../Icon';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport * as minusIcon from '../Icon/icons/minus.icon';\nimport * as dockIcon from '../Icon/icons/dock.icon';\nimport * as undockIcon from '../Icon/icons/undock.icon';\nimport Text from '../Text';\nimport { Count } from '../Badges';\n\nimport MinimizedModal from './MinimizedModal';\nimport type { ModalProps } from './Modal.types';\nimport {\n StyledModal,\n StyledModalHeader,\n StyledModalContent,\n StyledModalActions,\n StyledModalChildrenWrap\n} from './Modal.styles';\n\nregisterIcon(timesIcon, minusIcon, dockIcon, undockIcon);\n\nconst Modal: FunctionComponent<ModalProps & ForwardProps> = forwardRef(function Modal(\n props: PropsWithoutRef<ModalProps>,\n ref: Ref<HTMLElement>\n) {\n const {\n as,\n progress = false,\n heading,\n count,\n children,\n actions,\n stretch = false,\n center = false,\n defaultFocus,\n onBeforeOpen,\n onAfterOpen,\n onBeforeClose,\n onAfterClose,\n onRequestDismiss,\n onRequestMinimize,\n onRequestMaximize,\n onRequestDock,\n onRequestActivate,\n ...restProps\n } = props;\n\n const {\n alert,\n dismissible,\n minimizable,\n maximizable,\n dockable,\n state,\n dismiss,\n minimize,\n maximize,\n dock,\n unmount,\n top\n } = useModalContext();\n\n const modalRef = useConsolidatedRef(ref);\n const modalContentRef = useRef<HTMLDivElement>(null);\n const backdropRef = useRef<HTMLDivElement>(null);\n const closeButtonRef = useRef<HTMLButtonElement>(null);\n const previousState = usePrevious(state);\n const id = useUID();\n const t = useI18n();\n const [progressMessage, setProgressMessage] = useState<ProgressProps['message']>(undefined);\n const [isCloseButtonDisabled, setIsCloseButtonDisabled] = useState(true);\n\n const tryDismiss = () => {\n if (onRequestDismiss?.() !== false) {\n dismiss();\n }\n };\n\n const setFocus = () => {\n if (progress) return;\n\n const focusables = getFocusables(modalRef);\n\n if (defaultFocus?.current) {\n defaultFocus.current.focus();\n } else {\n const focusable =\n focusables.find(el => {\n return modalContentRef.current?.contains(el);\n }) ??\n closeButtonRef.current ??\n focusables[0];\n\n focusable?.focus();\n }\n };\n\n useFocusTrap(modalRef, false);\n useEvent('shortcut', e => e.stopPropagation(), { eventOptions: { capture: true } });\n\n useOuterEvent('mousedown', [modalRef], e => {\n if (['minimized', 'docked', 'closed'].includes(state)) return;\n\n if (dismissible) {\n if (e.target === backdropRef.current) {\n tryDismiss();\n }\n } else {\n modalRef.current?.focus();\n }\n });\n\n useEffect(() => {\n if (state === 'minimized') return;\n if (state === 'open' || state === 'maximized' || state === 'docked') setFocus();\n if (state === 'docked') setIsCloseButtonDisabled(false);\n\n // This won't actually run until potential changes to docked modal handling.\n if (state === 'closed' && previousState === 'docked') {\n onBeforeClose?.();\n unmount();\n onAfterClose?.();\n }\n }, [state]);\n\n useEffect(() => {\n // If a modal is already in a closed state on initial mount, unmount it.\n // This only happens when a docked modal closes since the ModalManager\n // remounts it outside of the DockedModals container if state !== 'docked'.\n if (state === 'closed') {\n onBeforeClose?.();\n unmount();\n onAfterClose?.();\n }\n }, []);\n\n // Dismiss on Escape needs to be handled using React event handling to be cancelable using SyntheticEvent.stopPropagation.\n const onModalKeyDown = useCallback(\n (e: ReactKeyboardEvent) => {\n if (dismissible && (state === 'open' || state === 'maximized') && e.key === 'Escape' && top) {\n tryDismiss();\n }\n },\n [dismissible, state, top, tryDismiss]\n );\n\n const onHeaderActionKeyDown = useCallback((e: ReactKeyboardEvent<HTMLButtonElement>) => {\n if (e.repeat && (e.key === 'Enter' || e.key === ' ')) e.preventDefault();\n }, []);\n\n useEffect(() => {\n if (!progress) {\n setFocus();\n }\n\n if (typeof progress === 'object' && progress.message !== progressMessage) {\n setProgressMessage(progress.message);\n } else if (progress === true) {\n setProgressMessage(t('loading'));\n }\n }, [progress]);\n\n const isModalSmallOrAbove = useBreakpoint('sm', { breakpointRef: modalRef });\n\n const maximized = stretch || state === 'maximized';\n\n const modal = (\n <Flex\n {...restProps}\n container={{ direction: 'column' }}\n ref={modalRef}\n as={StyledModal}\n forwardedAs={as}\n onClick={(e: MouseEvent) => e.stopPropagation()}\n onKeyDown={onModalKeyDown}\n alert={alert}\n role={alert ? 'alertdialog' : 'dialog'}\n stretch={maximized}\n center={center}\n aria-labelledby={`${id}-heading`}\n aria-describedby={alert ? `${id}-content` : undefined}\n aria-modal={state === 'docked' ? 'false' : 'true'}\n state={state}\n aria-busy={progress ? 'true' : 'false'}\n >\n <Flex\n container={{ justify: 'between', alignItems: 'start', gap: 1 }}\n item={{ shrink: 0 }}\n as={StyledModalHeader}\n hasAction={minimizable || dismissible}\n >\n <Flex\n container={{ alignItems: 'center', gap: 1 }}\n as={Text}\n variant='h2'\n id={`${id}-heading`}\n >\n <span>{heading}</span>\n {typeof count === 'number' && <Count>{count}</Count>}\n </Flex>\n\n <Flex container>\n {maximizable && !alert && state !== 'maximized' && (\n <Button\n icon\n variant='simple'\n label={t('maximize')}\n aria-label={t('modal_maximize')}\n onKeyDown={onHeaderActionKeyDown}\n onClick={() => {\n if (onRequestMaximize?.() !== false) {\n maximize();\n }\n }}\n >\n <Icon name='undock' />\n </Button>\n )}\n {dockable && !alert && state !== 'docked' && (\n <Button\n icon\n variant='simple'\n label={t('dock')}\n aria-label={t('modal_dock')}\n onKeyDown={onHeaderActionKeyDown}\n onClick={() => {\n if (onRequestDock?.() !== false) {\n dock();\n }\n }}\n >\n <Icon name='dock' />\n </Button>\n )}\n {minimizable && !alert && (\n <Button\n icon\n variant='simple'\n label={t('minimize')}\n aria-label={t('modal_minimize')}\n onKeyDown={onHeaderActionKeyDown}\n onClick={() => {\n if (onRequestMinimize?.() !== false) {\n minimize();\n }\n }}\n >\n <Icon name='minus' />\n </Button>\n )}\n {dismissible && !alert && (\n <Button\n icon\n variant='simple'\n label={t('close')}\n aria-label={t('modal_close')}\n onKeyDown={onHeaderActionKeyDown}\n onClick={() => {\n if (!isCloseButtonDisabled) {\n tryDismiss();\n }\n }}\n ref={closeButtonRef}\n >\n <Icon name='times' />\n </Button>\n )}\n </Flex>\n </Flex>\n\n <Flex\n item={{ grow: 1 }}\n as={StyledModalContent}\n ref={modalContentRef}\n style={\n modalContentRef.current\n ? { '--scroll-top': `${modalContentRef.current.scrollTop}px` }\n : undefined\n }\n >\n {children && (\n <StyledModalChildrenWrap id={`${id}-content`} inert={progress ? '' : undefined}>\n {children}\n </StyledModalChildrenWrap>\n )}\n\n <Progress\n visible={!!progress}\n focusOnVisible\n delay\n placement='local'\n message={progressMessage}\n onTransitionEndOut={() => setProgressMessage(undefined)}\n />\n </Flex>\n\n {actions && (\n <Flex\n container={{\n pad: [2.5, 3, 3],\n gap: 1,\n ...(isModalSmallOrAbove\n ? { direction: 'row', justify: 'end' }\n : { direction: 'column' })\n }}\n item={{ shrink: 0 }}\n as={StyledModalActions}\n isSmallOrAbove={isModalSmallOrAbove}\n >\n {actions}\n </Flex>\n )}\n </Flex>\n );\n\n const renderModal =\n state === 'docked' ? (\n modal\n ) : (\n <Backdrop\n ref={backdropRef}\n container={{\n alignItems: center || maximized ? 'center' : 'start'\n }}\n transitionSpeed='slow'\n open={state === 'open' || state === 'maximized'}\n onBeforeTransitionIn={onBeforeOpen}\n onAfterTransitionIn={() => {\n setIsCloseButtonDisabled(false);\n onAfterOpen?.();\n }}\n onBeforeTransitionOut={onBeforeClose}\n onAfterTransitionOut={() => {\n unmount();\n onAfterClose?.();\n }}\n >\n {modal}\n </Backdrop>\n );\n\n return state === 'minimized' ? <MinimizedModal {...props} {...restProps} /> : renderModal;\n});\n\nexport default Modal;\n"]}
|
|
1
|
+
{"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../../src/components/Modal/Modal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useEffect, useRef, useCallback, useState } from 'react';\nimport type {\n FunctionComponent,\n PropsWithoutRef,\n Ref,\n MouseEvent,\n KeyboardEvent as ReactKeyboardEvent\n} from 'react';\n\nimport Progress, { type ProgressProps } from '../Progress';\nimport { getFocusables } from '../../utils';\nimport Backdrop from '../Backdrop';\nimport Flex from '../Flex';\nimport Button from '../Button';\nimport type { ForwardProps } from '../../types';\nimport {\n useConsolidatedRef,\n useI18n,\n useOuterEvent,\n useUID,\n useFocusTrap,\n usePrevious,\n useModalContext,\n useEvent,\n useBreakpoint\n} from '../../hooks';\nimport Icon, { registerIcon } from '../Icon';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport * as minusIcon from '../Icon/icons/minus.icon';\nimport * as dockIcon from '../Icon/icons/dock.icon';\nimport * as undockIcon from '../Icon/icons/undock.icon';\nimport Text from '../Text';\nimport { Count } from '../Badges';\n\nimport MinimizedModal from './MinimizedModal';\nimport type { ModalProps } from './Modal.types';\nimport {\n StyledModal,\n StyledModalHeader,\n StyledModalContent,\n StyledModalActions,\n StyledModalChildrenWrap\n} from './Modal.styles';\n\nregisterIcon(timesIcon, minusIcon, dockIcon, undockIcon);\n\nconst Modal: FunctionComponent<ModalProps & ForwardProps> = forwardRef(function Modal(\n props: PropsWithoutRef<ModalProps>,\n ref: Ref<HTMLElement>\n) {\n const {\n as,\n progress = false,\n heading,\n headingTag = 'h2',\n count,\n children,\n actions,\n stretch = false,\n center = false,\n defaultFocus,\n onBeforeOpen,\n onAfterOpen,\n onBeforeClose,\n onAfterClose,\n onRequestDismiss,\n onRequestMinimize,\n onRequestMaximize,\n onRequestDock,\n onRequestActivate,\n ...restProps\n } = props;\n\n const {\n alert,\n dismissible,\n minimizable,\n maximizable,\n dockable,\n state,\n dismiss,\n minimize,\n maximize,\n dock,\n unmount,\n top\n } = useModalContext();\n\n const modalRef = useConsolidatedRef(ref);\n const modalContentRef = useRef<HTMLDivElement>(null);\n const backdropRef = useRef<HTMLDivElement>(null);\n const closeButtonRef = useRef<HTMLButtonElement>(null);\n const previousState = usePrevious(state);\n const id = useUID();\n const t = useI18n();\n const [progressMessage, setProgressMessage] = useState<ProgressProps['message']>(undefined);\n const [isCloseButtonDisabled, setIsCloseButtonDisabled] = useState(true);\n\n const tryDismiss = () => {\n if (onRequestDismiss?.() !== false) {\n dismiss();\n }\n };\n\n const setFocus = () => {\n if (progress) return;\n\n const focusables = getFocusables(modalRef);\n\n if (defaultFocus?.current) {\n defaultFocus.current.focus();\n } else {\n const focusable =\n focusables.find(el => {\n return modalContentRef.current?.contains(el);\n }) ??\n closeButtonRef.current ??\n focusables[0];\n\n focusable?.focus();\n }\n };\n\n useFocusTrap(modalRef, false);\n useEvent('shortcut', e => e.stopPropagation(), { eventOptions: { capture: true } });\n\n useOuterEvent('mousedown', [modalRef], e => {\n if (['minimized', 'docked', 'closed'].includes(state)) return;\n\n if (dismissible) {\n if (e.target === backdropRef.current) {\n tryDismiss();\n }\n } else {\n modalRef.current?.focus();\n }\n });\n\n useEffect(() => {\n if (state === 'minimized') return;\n if (state === 'open' || state === 'maximized' || state === 'docked') setFocus();\n if (state === 'docked') setIsCloseButtonDisabled(false);\n\n // This won't actually run until potential changes to docked modal handling.\n if (state === 'closed' && previousState === 'docked') {\n onBeforeClose?.();\n unmount();\n onAfterClose?.();\n }\n }, [state]);\n\n useEffect(() => {\n // If a modal is already in a closed state on initial mount, unmount it.\n // This only happens when a docked modal closes since the ModalManager\n // remounts it outside of the DockedModals container if state !== 'docked'.\n if (state === 'closed') {\n onBeforeClose?.();\n unmount();\n onAfterClose?.();\n }\n }, []);\n\n // Dismiss on Escape needs to be handled using React event handling to be cancelable using SyntheticEvent.stopPropagation.\n const onModalKeyDown = useCallback(\n (e: ReactKeyboardEvent) => {\n if (dismissible && (state === 'open' || state === 'maximized') && e.key === 'Escape' && top) {\n tryDismiss();\n }\n },\n [dismissible, state, top, tryDismiss]\n );\n\n const onHeaderActionKeyDown = useCallback((e: ReactKeyboardEvent<HTMLButtonElement>) => {\n if (e.repeat && (e.key === 'Enter' || e.key === ' ')) e.preventDefault();\n }, []);\n\n useEffect(() => {\n if (!progress) {\n setFocus();\n }\n\n if (typeof progress === 'object' && progress.message !== progressMessage) {\n setProgressMessage(progress.message);\n } else if (progress === true) {\n setProgressMessage(t('loading'));\n }\n }, [progress]);\n\n const isModalSmallOrAbove = useBreakpoint('sm', { breakpointRef: modalRef });\n\n const maximized = stretch || state === 'maximized';\n\n const modal = (\n <Flex\n {...restProps}\n container={{ direction: 'column' }}\n ref={modalRef}\n as={StyledModal}\n forwardedAs={as}\n onClick={(e: MouseEvent) => e.stopPropagation()}\n onKeyDown={onModalKeyDown}\n alert={alert}\n role={alert ? 'alertdialog' : 'dialog'}\n stretch={maximized}\n center={center}\n aria-labelledby={`${id}-heading`}\n aria-describedby={alert ? `${id}-content` : undefined}\n aria-modal={state === 'docked' ? 'false' : 'true'}\n state={state}\n aria-busy={progress ? 'true' : 'false'}\n >\n <Flex\n container={{ justify: 'between', alignItems: 'start', gap: 1 }}\n item={{ shrink: 0 }}\n as={StyledModalHeader}\n hasAction={minimizable || dismissible}\n >\n <Flex\n container={{ alignItems: 'center', gap: 1 }}\n as={Text}\n variant={headingTag}\n id={`${id}-heading`}\n >\n <span>{heading}</span>\n {typeof count === 'number' && <Count>{count}</Count>}\n </Flex>\n\n <Flex container>\n {maximizable && !alert && state !== 'maximized' && (\n <Button\n icon\n variant='simple'\n label={t('maximize')}\n aria-label={t('modal_maximize')}\n onKeyDown={onHeaderActionKeyDown}\n onClick={() => {\n if (onRequestMaximize?.() !== false) {\n maximize();\n }\n }}\n >\n <Icon name='undock' />\n </Button>\n )}\n {dockable && !alert && state !== 'docked' && (\n <Button\n icon\n variant='simple'\n label={t('dock')}\n aria-label={t('modal_dock')}\n onKeyDown={onHeaderActionKeyDown}\n onClick={() => {\n if (onRequestDock?.() !== false) {\n dock();\n }\n }}\n >\n <Icon name='dock' />\n </Button>\n )}\n {minimizable && !alert && (\n <Button\n icon\n variant='simple'\n label={t('minimize')}\n aria-label={t('modal_minimize')}\n onKeyDown={onHeaderActionKeyDown}\n onClick={() => {\n if (onRequestMinimize?.() !== false) {\n minimize();\n }\n }}\n >\n <Icon name='minus' />\n </Button>\n )}\n {dismissible && !alert && (\n <Button\n icon\n variant='simple'\n label={t('close')}\n aria-label={t('modal_close')}\n onKeyDown={onHeaderActionKeyDown}\n onClick={() => {\n if (!isCloseButtonDisabled) {\n tryDismiss();\n }\n }}\n ref={closeButtonRef}\n >\n <Icon name='times' />\n </Button>\n )}\n </Flex>\n </Flex>\n\n <Flex\n item={{ grow: 1 }}\n as={StyledModalContent}\n ref={modalContentRef}\n style={\n modalContentRef.current\n ? { '--scroll-top': `${modalContentRef.current.scrollTop}px` }\n : undefined\n }\n >\n {children && (\n <StyledModalChildrenWrap id={`${id}-content`} inert={progress ? '' : undefined}>\n {children}\n </StyledModalChildrenWrap>\n )}\n\n <Progress\n visible={!!progress}\n focusOnVisible\n delay\n placement='local'\n message={progressMessage}\n onTransitionEndOut={() => setProgressMessage(undefined)}\n />\n </Flex>\n\n {actions && (\n <Flex\n container={{\n pad: [2.5, 3, 3],\n gap: 1,\n ...(isModalSmallOrAbove\n ? { direction: 'row', justify: 'end' }\n : { direction: 'column' })\n }}\n item={{ shrink: 0 }}\n as={StyledModalActions}\n isSmallOrAbove={isModalSmallOrAbove}\n >\n {actions}\n </Flex>\n )}\n </Flex>\n );\n\n const renderModal =\n state === 'docked' ? (\n modal\n ) : (\n <Backdrop\n ref={backdropRef}\n container={{\n alignItems: center || maximized ? 'center' : 'start'\n }}\n transitionSpeed='slow'\n open={state === 'open' || state === 'maximized'}\n onBeforeTransitionIn={onBeforeOpen}\n onAfterTransitionIn={() => {\n setIsCloseButtonDisabled(false);\n onAfterOpen?.();\n }}\n onBeforeTransitionOut={onBeforeClose}\n onAfterTransitionOut={() => {\n unmount();\n onAfterClose?.();\n }}\n >\n {modal}\n </Backdrop>\n );\n\n return state === 'minimized' ? <MinimizedModal {...props} {...restProps} /> : renderModal;\n});\n\nexport default Modal;\n"]}
|
|
@@ -7,5 +7,5 @@ export declare const StyledModalContent: import("styled-components").StyledCompo
|
|
|
7
7
|
export declare const StyledModalActions: import("styled-components").StyledComponent<"footer", import("styled-components").DefaultTheme, {
|
|
8
8
|
isSmallOrAbove: boolean;
|
|
9
9
|
}, never>;
|
|
10
|
-
export declare const StyledModal: import("styled-components").StyledComponent<"article", import("styled-components").DefaultTheme, Partial<import("../Card").CardProps> & Pick<ModalProps, "progress" | "children" | "as" | "heading" | "className" | "actions" | "count" | "forwardedAs" | "defaultFocus" | "onBeforeOpen" | "onAfterOpen" | "onBeforeClose" | "onAfterClose" | "onRequestDismiss" | "onRequestMinimize" | "onRequestMaximize" | "onRequestDock" | "onRequestActivate"> & Required<Pick<ModalProps, "stretch" | "center" | "autoWidth">> & Pick<ModalContextValue, "alert" | "state">, never>;
|
|
10
|
+
export declare const StyledModal: import("styled-components").StyledComponent<"article", import("styled-components").DefaultTheme, Partial<import("../Card").CardProps> & Pick<ModalProps, "progress" | "children" | "as" | "heading" | "className" | "actions" | "count" | "forwardedAs" | "headingTag" | "defaultFocus" | "onBeforeOpen" | "onAfterOpen" | "onBeforeClose" | "onAfterClose" | "onRequestDismiss" | "onRequestMinimize" | "onRequestMaximize" | "onRequestDock" | "onRequestActivate"> & Required<Pick<ModalProps, "stretch" | "center" | "autoWidth">> & Pick<ModalContextValue, "alert" | "state">, never>;
|
|
11
11
|
//# sourceMappingURL=Modal.styles.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/Modal.styles.ts"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,iBAAiB,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAInE,eAAO,MAAM,uBAAuB,yGAAe,CAAC;AAEpD,eAAO,MAAM,iBAAiB;;SAqB7B,CAAC;AAIF,eAAO,MAAM,kBAAkB,yGAiB7B,CAAC;AAIH,eAAO,MAAM,kBAAkB;oBAAmC,OAAO;SAoBxE,CAAC;AAIF,eAAO,MAAM,WAAW,
|
|
1
|
+
{"version":3,"file":"Modal.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/Modal.styles.ts"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,iBAAiB,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAInE,eAAO,MAAM,uBAAuB,yGAAe,CAAC;AAEpD,eAAO,MAAM,iBAAiB;;SAqB7B,CAAC;AAIF,eAAO,MAAM,kBAAkB,yGAiB7B,CAAC;AAIH,eAAO,MAAM,kBAAkB;oBAAmC,OAAO;SAoBxE,CAAC;AAIF,eAAO,MAAM,WAAW,6jBA6GtB,CAAC"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { ComponentType, ReactNode, RefObject, Context } from 'react';
|
|
2
|
-
import type { ProgressProps } from '@pega/cosmos-react-core';
|
|
2
|
+
import type { HeadingTag, ProgressProps } from '@pega/cosmos-react-core';
|
|
3
3
|
import type { BaseProps, AsProp, DeferInfer } from '../../types';
|
|
4
4
|
export interface ModalManagerProps {
|
|
5
5
|
/** Content that will be provided modal manager context. */
|
|
@@ -61,6 +61,11 @@ export interface ModalProps extends BaseProps, AsProp {
|
|
|
61
61
|
progress?: boolean | Pick<ProgressProps, 'message' | 'minValue' | 'maxValue' | 'value'>;
|
|
62
62
|
/** Heading for the Modal. */
|
|
63
63
|
heading: ReactNode;
|
|
64
|
+
/**
|
|
65
|
+
* Heading level.
|
|
66
|
+
* @default h2
|
|
67
|
+
*/
|
|
68
|
+
headingTag?: HeadingTag;
|
|
64
69
|
/** Count for list data presented in the Modal. */
|
|
65
70
|
count?: number;
|
|
66
71
|
/** Content for the Modal. */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.types.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/Modal.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAE1E,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;
|
|
1
|
+
{"version":3,"file":"Modal.types.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/Modal.types.ts"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.types.js","sourceRoot":"","sources":["../../../src/components/Modal/Modal.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentType, ReactNode, RefObject, Context } from 'react';\n\nimport type { ProgressProps } from '@pega/cosmos-react-core';\n\nimport type { BaseProps, AsProp, DeferInfer } from '../../types';\n\nexport interface ModalManagerProps {\n /** Content that will be provided modal manager context. */\n children: ReactNode;\n}\n\nexport interface ModalOptions {\n /**\n * If true, the Modal will render as an alert that is not dismissible.\n * @default false\n */\n alert?: boolean;\n /**\n * Toggle Esc keypress action or clicking backdrop to dismiss Modal. Also displays dismiss button on Modal header.\n * Not valid for Modals of type alert.\n * @default alert ? false : true\n */\n dismissible?: boolean;\n /**\n * Toggle minimize button in header thereby helping in rendering minimizable/non-minimizable Modals.\n * Not valid for Modals of type alert.\n * @default false\n */\n minimizable?: boolean;\n /**\n * Toggle maximize button in header thereby helping in rendering maximizable/non-maximizable Modals.\n * Not valid for Modals of type alert.\n * @default false\n */\n maximizable?: boolean;\n /** Positions the modal in the right corner without backdrop\n * @default false\n */\n dockable?: boolean;\n /**\n * If true, the Modal will initially render in a minimized state.\n * @default false\n */\n defaultMinimized?: boolean;\n /**\n * If true, the Modal content will be removed from the DOM when in a minimized state.\n * @default true\n */\n unmountWhenMinimized?: boolean;\n /** Used to identify the modal. Will be passed back as an argument in life cycle functions. */\n id?: string;\n /** Life cycle function that will be run when the modal is minimized. */\n onMinimize?: (id: string) => void;\n /** Life cycle function that will be run when the modal is maximized. */\n onMaximize?: (id: string) => void;\n /** Life cycle function that will be run when the modal is maximized. */\n onDock?: (id: string) => void;\n /** Life cycle function that will be run when the modal is activated (un minimized). */\n onActivate?: (id: string) => void;\n /** Life cycle function that will be run when the modal is dismissed. */\n onDismiss?: (id: string) => void;\n}\n\nexport interface ModalProps extends BaseProps, AsProp {\n /** Place a modal into a loading state by way of a bool or an object which allows for a custom message and determinate progress. */\n progress?: boolean | Pick<ProgressProps, 'message' | 'minValue' | 'maxValue' | 'value'>;\n /** Heading for the Modal. */\n heading: ReactNode;\n /** Count for list data presented in the Modal. */\n count?: number;\n /** Content for the Modal. */\n children: ReactNode;\n /** Actions for the Modal. */\n actions?: ReactNode;\n /**\n * Render the modal in full width and height.\n * @default false\n */\n stretch?: boolean;\n /**\n * Toggle to position the Modal vertically centered or not.\n * @default false\n */\n center?: boolean;\n /**\n * Automatically compute the width of the Modal based on the content.\n * @default false\n */\n autoWidth?: boolean;\n /** Takes a React Ref of the element to be focused initially on mounting Modal. */\n defaultFocus?: RefObject<HTMLElement>;\n /** Accepts a callback function that gets invoked before opening a Modal. */\n onBeforeOpen?: () => void;\n /** Accepts a callback function that gets invoked after opening a Modal. */\n onAfterOpen?: () => void;\n /** Accepts a callback function that gets invoked before closing a Modal. */\n onBeforeClose?: () => void;\n /** Accepts a callback function that gets invoked after closing a Modal. */\n onAfterClose?: () => void;\n /**\n * Accepts a callback function that returns a boolean before dismissing a modal.\n * If the boolean is false, the modal will not be dismissed.\n */\n onRequestDismiss?: () => boolean | void;\n /**\n * Accepts a callback function that returns a boolean before minimizing a modal.\n * If the boolean is false, the modal will not be minimized.\n */\n onRequestMinimize?: () => boolean | void;\n /**\n * Accepts a callback function that returns a boolean before maximizing a modal.\n * If the boolean is false, the modal will not be maximized.\n */\n onRequestMaximize?: () => boolean | void;\n /**\n * Accepts a callback function that returns a boolean before docking a modal.\n * If the boolean is false, the modal will not be dockable.\n */\n onRequestDock?: () => boolean | void;\n /**\n * Accepts a callback function that returns a boolean before activating a modal.\n * If the boolean is false, the modal will not be activated.\n */\n onRequestActivate?: () => boolean | void;\n}\n\nexport type ModalState = 'open' | 'closed' | 'minimized' | 'maximized' | 'docked';\n\nexport interface ModalMethods<P extends object = object> {\n /** Closes the referenced Modal when called. */\n dismiss: () => void;\n /** Updates the referenced Modal with a set of props. */\n update: (props: Partial<P>) => void;\n /** Minimizes the referenced Modal. */\n minimize: () => void;\n /** Maximizes the referenced Modal. */\n maximize: () => void;\n /** Docks the referenced Modal. */\n dock: () => void;\n /** Will reopen the referenced Modal if minimized, and minimize any open Modals that are minimizable. */\n activate: () => void;\n /** Removes the referenced Modal from the DOM. */\n unmount: () => void;\n}\n\nexport interface ModalManagerContextValue {\n /**\n * The function that will create the Modal. This function accepts the component to render a Modal,\n * props for that component, and options for that Modal.\n */\n create: <P extends object>(\n component: ComponentType<P>,\n props?: DeferInfer<P>,\n options?: ModalOptions\n ) => ModalMethods<P>;\n ModalContext: Context<ModalContextValue>;\n initialized: boolean;\n}\n\nexport interface ModalContextValue extends ModalMethods, ModalOptions {\n state: ModalState;\n top: boolean;\n /** @internal */\n initialized: boolean;\n}\n\nexport interface ModalObject<P extends object = object> {\n id: string;\n state: ModalState;\n methods: ModalMethods<P>;\n props?: P;\n Component: ComponentType<P>;\n options: ModalOptions;\n}\n"]}
|
|
1
|
+
{"version":3,"file":"Modal.types.js","sourceRoot":"","sources":["../../../src/components/Modal/Modal.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentType, ReactNode, RefObject, Context } from 'react';\n\nimport type { HeadingTag, ProgressProps } from '@pega/cosmos-react-core';\n\nimport type { BaseProps, AsProp, DeferInfer } from '../../types';\n\nexport interface ModalManagerProps {\n /** Content that will be provided modal manager context. */\n children: ReactNode;\n}\n\nexport interface ModalOptions {\n /**\n * If true, the Modal will render as an alert that is not dismissible.\n * @default false\n */\n alert?: boolean;\n /**\n * Toggle Esc keypress action or clicking backdrop to dismiss Modal. Also displays dismiss button on Modal header.\n * Not valid for Modals of type alert.\n * @default alert ? false : true\n */\n dismissible?: boolean;\n /**\n * Toggle minimize button in header thereby helping in rendering minimizable/non-minimizable Modals.\n * Not valid for Modals of type alert.\n * @default false\n */\n minimizable?: boolean;\n /**\n * Toggle maximize button in header thereby helping in rendering maximizable/non-maximizable Modals.\n * Not valid for Modals of type alert.\n * @default false\n */\n maximizable?: boolean;\n /** Positions the modal in the right corner without backdrop\n * @default false\n */\n dockable?: boolean;\n /**\n * If true, the Modal will initially render in a minimized state.\n * @default false\n */\n defaultMinimized?: boolean;\n /**\n * If true, the Modal content will be removed from the DOM when in a minimized state.\n * @default true\n */\n unmountWhenMinimized?: boolean;\n /** Used to identify the modal. Will be passed back as an argument in life cycle functions. */\n id?: string;\n /** Life cycle function that will be run when the modal is minimized. */\n onMinimize?: (id: string) => void;\n /** Life cycle function that will be run when the modal is maximized. */\n onMaximize?: (id: string) => void;\n /** Life cycle function that will be run when the modal is maximized. */\n onDock?: (id: string) => void;\n /** Life cycle function that will be run when the modal is activated (un minimized). */\n onActivate?: (id: string) => void;\n /** Life cycle function that will be run when the modal is dismissed. */\n onDismiss?: (id: string) => void;\n}\n\nexport interface ModalProps extends BaseProps, AsProp {\n /** Place a modal into a loading state by way of a bool or an object which allows for a custom message and determinate progress. */\n progress?: boolean | Pick<ProgressProps, 'message' | 'minValue' | 'maxValue' | 'value'>;\n /** Heading for the Modal. */\n heading: ReactNode;\n /**\n * Heading level.\n * @default h2\n */\n headingTag?: HeadingTag;\n /** Count for list data presented in the Modal. */\n count?: number;\n /** Content for the Modal. */\n children: ReactNode;\n /** Actions for the Modal. */\n actions?: ReactNode;\n /**\n * Render the modal in full width and height.\n * @default false\n */\n stretch?: boolean;\n /**\n * Toggle to position the Modal vertically centered or not.\n * @default false\n */\n center?: boolean;\n /**\n * Automatically compute the width of the Modal based on the content.\n * @default false\n */\n autoWidth?: boolean;\n /** Takes a React Ref of the element to be focused initially on mounting Modal. */\n defaultFocus?: RefObject<HTMLElement>;\n /** Accepts a callback function that gets invoked before opening a Modal. */\n onBeforeOpen?: () => void;\n /** Accepts a callback function that gets invoked after opening a Modal. */\n onAfterOpen?: () => void;\n /** Accepts a callback function that gets invoked before closing a Modal. */\n onBeforeClose?: () => void;\n /** Accepts a callback function that gets invoked after closing a Modal. */\n onAfterClose?: () => void;\n /**\n * Accepts a callback function that returns a boolean before dismissing a modal.\n * If the boolean is false, the modal will not be dismissed.\n */\n onRequestDismiss?: () => boolean | void;\n /**\n * Accepts a callback function that returns a boolean before minimizing a modal.\n * If the boolean is false, the modal will not be minimized.\n */\n onRequestMinimize?: () => boolean | void;\n /**\n * Accepts a callback function that returns a boolean before maximizing a modal.\n * If the boolean is false, the modal will not be maximized.\n */\n onRequestMaximize?: () => boolean | void;\n /**\n * Accepts a callback function that returns a boolean before docking a modal.\n * If the boolean is false, the modal will not be dockable.\n */\n onRequestDock?: () => boolean | void;\n /**\n * Accepts a callback function that returns a boolean before activating a modal.\n * If the boolean is false, the modal will not be activated.\n */\n onRequestActivate?: () => boolean | void;\n}\n\nexport type ModalState = 'open' | 'closed' | 'minimized' | 'maximized' | 'docked';\n\nexport interface ModalMethods<P extends object = object> {\n /** Closes the referenced Modal when called. */\n dismiss: () => void;\n /** Updates the referenced Modal with a set of props. */\n update: (props: Partial<P>) => void;\n /** Minimizes the referenced Modal. */\n minimize: () => void;\n /** Maximizes the referenced Modal. */\n maximize: () => void;\n /** Docks the referenced Modal. */\n dock: () => void;\n /** Will reopen the referenced Modal if minimized, and minimize any open Modals that are minimizable. */\n activate: () => void;\n /** Removes the referenced Modal from the DOM. */\n unmount: () => void;\n}\n\nexport interface ModalManagerContextValue {\n /**\n * The function that will create the Modal. This function accepts the component to render a Modal,\n * props for that component, and options for that Modal.\n */\n create: <P extends object>(\n component: ComponentType<P>,\n props?: DeferInfer<P>,\n options?: ModalOptions\n ) => ModalMethods<P>;\n ModalContext: Context<ModalContextValue>;\n initialized: boolean;\n}\n\nexport interface ModalContextValue extends ModalMethods, ModalOptions {\n state: ModalState;\n top: boolean;\n /** @internal */\n initialized: boolean;\n}\n\nexport interface ModalObject<P extends object = object> {\n id: string;\n state: ModalState;\n methods: ModalMethods<P>;\n props?: P;\n Component: ComponentType<P>;\n options: ModalOptions;\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NumberInput.d.ts","sourceRoot":"","sources":["../../../src/components/Number/NumberInput.tsx"],"names":[],"mappings":"AAyBA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;;;;AAY5D,
|
|
1
|
+
{"version":3,"file":"NumberInput.d.ts","sourceRoot":"","sources":["../../../src/components/Number/NumberInput.tsx"],"names":[],"mappings":"AAyBA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;;;;AAY5D,wBA4QE"}
|
|
@@ -7,7 +7,7 @@ import * as minusIcon from '../Icon/icons/minus.icon';
|
|
|
7
7
|
import Flex from '../Flex';
|
|
8
8
|
import FormField from '../FormField';
|
|
9
9
|
import { useArrows, useConfiguration, useConsolidatedRef, useI18n, useInputFormatter, useTestIds, useUID } from '../../hooks';
|
|
10
|
-
import
|
|
10
|
+
import Input from '../Input';
|
|
11
11
|
import { withTestIds } from '../../utils';
|
|
12
12
|
import VisuallyHiddenText from '../VisuallyHiddenText';
|
|
13
13
|
import StyledNumberInput, { StyledStepperInput } from './NumberInput.styles';
|
|
@@ -17,13 +17,13 @@ import { getNumberInputTestIds } from './Number.test-ids';
|
|
|
17
17
|
registerIcon(minusIcon, plusIcon);
|
|
18
18
|
export default withTestIds(forwardRef(function NumberInput(props, ref) {
|
|
19
19
|
const uid = useUID();
|
|
20
|
-
const { testId, id = uid, status, label, labelHidden, info, required, disabled, readOnly, additionalInfo, value = '', onChange, onFocus, onBlur, onResolveSuggestion, unit, showDecimal = true, numberOfDecimals: numberOfDecimalsProp = NUMBER_MAX_DECIMAL_PLACES, showGroupSeparators = true, min = Number.MIN_SAFE_INTEGER, max = Number.MAX_SAFE_INTEGER, step = 1, variant, 'aria-label': ariaLabel, autoFocus, ...restProps } = props;
|
|
20
|
+
const { testId, id = uid, status, label, labelHidden, info, required, disabled, readOnly, additionalInfo, value = '', onChange, onFocus, onBlur, onResolveSuggestion, unit, showDecimal = true, numberOfDecimals: numberOfDecimalsProp = NUMBER_MAX_DECIMAL_PLACES, showGroupSeparators = true, min = Number.MIN_SAFE_INTEGER, max = Number.MAX_SAFE_INTEGER, step = 1, variant, 'aria-label': ariaLabel, autoFocus, defaultValue, ...restProps } = props;
|
|
21
21
|
const testIds = useTestIds(testId, getNumberInputTestIds);
|
|
22
22
|
const { locale } = useConfiguration();
|
|
23
23
|
const inputRef = useConsolidatedRef(ref);
|
|
24
24
|
const containerRef = useRef(null);
|
|
25
25
|
const maximumFractionDigits = showDecimal ? numberOfDecimalsProp : 0;
|
|
26
|
-
const decimalSign = useMemo(() => getDecimalSign(locale), [locale]);
|
|
26
|
+
const decimalSign = useMemo(() => getDecimalSign(locale, { numberingSystem: 'latn' }), [locale]);
|
|
27
27
|
const formatValue = useCallback(number => {
|
|
28
28
|
return getFormattedValue(number, locale, unit, {
|
|
29
29
|
useGrouping: showGroupSeparators,
|
|
@@ -32,7 +32,7 @@ export default withTestIds(forwardRef(function NumberInput(props, ref) {
|
|
|
32
32
|
}, [locale, unit, showGroupSeparators, maximumFractionDigits]);
|
|
33
33
|
const onInputChange = (e) => {
|
|
34
34
|
const inputValue = e.target.value;
|
|
35
|
-
const cleanedInputValue = getCleanedValue(inputValue,
|
|
35
|
+
const cleanedInputValue = getCleanedValue(inputValue, locale, maximumFractionDigits);
|
|
36
36
|
if (cleanedInputValue === value)
|
|
37
37
|
return;
|
|
38
38
|
onChange(cleanedInputValue);
|
|
@@ -60,7 +60,7 @@ export default withTestIds(forwardRef(function NumberInput(props, ref) {
|
|
|
60
60
|
}
|
|
61
61
|
else if (input.selectionStart !== null &&
|
|
62
62
|
!input.value.charAt(input.selectionStart - 1).match(/\d/)) {
|
|
63
|
-
onChange(getCleanedValue(`${input.value}0${decimalSign}`,
|
|
63
|
+
onChange(getCleanedValue(`${input.value}0${decimalSign}`, locale, maximumFractionDigits));
|
|
64
64
|
e.preventDefault();
|
|
65
65
|
}
|
|
66
66
|
break;
|
|
@@ -88,9 +88,9 @@ export default withTestIds(forwardRef(function NumberInput(props, ref) {
|
|
|
88
88
|
onBlur?.(parsableValue);
|
|
89
89
|
}
|
|
90
90
|
};
|
|
91
|
-
const formattedValue = useInputFormatter(inputRef, value, formatValue,
|
|
91
|
+
const formattedValue = useInputFormatter(inputRef, value, formatValue, `0-9${decimalSign}-`);
|
|
92
92
|
const t = useI18n();
|
|
93
|
-
const numberInput = (_jsx(Flex, { "data-testid": testIds.root, as: StyledNumberInput, hasSuggestion: status === 'pending' && !!onResolveSuggestion, container: { alignItems: 'center', wrap: 'nowrap' }, status: status, readOnly: readOnly, disabled: disabled, children: _jsx(
|
|
93
|
+
const numberInput = (_jsx(Flex, { "data-testid": testIds.root, as: StyledNumberInput, hasSuggestion: status === 'pending' && !!onResolveSuggestion, container: { alignItems: 'center', wrap: 'nowrap' }, status: status, readOnly: readOnly, disabled: disabled, children: _jsx(Input, { "data-testid": testIds.control, onChange: onInputChange, id: id, readOnly: readOnly, required: required, disabled: disabled, ...restProps, inputMode: 'numeric', ref: inputRef, value: formattedValue, onKeyDown: onKeyDown, onFocus: onInputFocusEvent, onBlur: onInputFocusEvent, "aria-label": `${ariaLabel || label}. ${unit ? t('measured_in', [unit]) : ''}`, maxLength: 16, autoFocus: autoFocus, "aria-describedby": info ? `${id}-info` : undefined }) }));
|
|
94
94
|
const onMinusClick = () => {
|
|
95
95
|
onChange?.(getDecrementedValue(value, min, max, step));
|
|
96
96
|
};
|
|
@@ -107,7 +107,7 @@ export default withTestIds(forwardRef(function NumberInput(props, ref) {
|
|
|
107
107
|
const stepper = (_jsxs(Flex, { as: StyledStepperInput, hasSuggestion: status === 'pending' && !!onResolveSuggestion, container: { alignItems: 'center', wrap: 'nowrap' }, status: status, readOnly: readOnly, disabled: disabled, size: formattedValue?.length, ref: elementRef, role: 'application', children: [_jsx(Button, { "data-testid": testIds.minus, variant: 'simple', icon: true, onClick: onMinusClick, readOnly: readOnly, disabled: disabled, tabIndex: -1, "aria-label": t('decrease_value_by', [step]), children: _jsx(Icon, { name: 'minus' }) }), _jsx(Flex, { container: { alignItems: 'center', wrap: 'nowrap', justify: 'center' }, item: { grow: 1 }, ref: containerRef, onClick: (e) => {
|
|
108
108
|
if (e.target === containerRef.current)
|
|
109
109
|
inputRef?.current?.focus();
|
|
110
|
-
}, children: _jsx(
|
|
110
|
+
}, children: _jsx(Input, { "data-testid": testIds.control, onChange: onInputChange, id: id, readOnly: readOnly, required: required, disabled: disabled, ...restProps, inputMode: 'numeric', ref: inputRef, value: formattedValue, onKeyDown: onKeyDown, onFocus: onInputFocusEvent, onBlur: onInputFocusEvent, "aria-label": `${ariaLabel || label}. ${unit ? t('measured_in', [unit]) : ''}`, maxLength: 16, autoFocus: autoFocus, "aria-describedby": info ? `${id}-info ${id}-input-description` : `${id}-input-description` }) }), _jsx(Button, { "data-testid": testIds.plus, variant: 'simple', icon: true, onClick: onPlusClick, readOnly: readOnly, disabled: disabled, tabIndex: -1, "aria-label": t('increase_value_by', [step]), children: _jsx(Icon, { name: 'plus' }) }), _jsx(VisuallyHiddenText, { id: `${id}-input-description`, children: t('stepper_instructions') }), _jsx(VisuallyHiddenText, { "aria-live": 'polite', children: formattedValue })] }));
|
|
111
111
|
const Comp = variant === 'stepper' && !readOnly ? stepper : numberInput;
|
|
112
112
|
return label ? (_jsx(FormField, { testId: testIds, label: label, labelHidden: labelHidden, id: id, info: info, status: status, required: required, readOnly: readOnly, disabled: disabled, additionalInfo: additionalInfo, onResolveSuggestion: onResolveSuggestion, children: Comp })) : (Comp);
|
|
113
113
|
}), getNumberInputTestIds);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NumberInput.js","sourceRoot":"","sources":["../../../src/components/Number/NumberInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useCallback, useMemo, useRef } from 'react';\nimport type { ChangeEvent, KeyboardEvent, PropsWithoutRef, FocusEvent } from 'react';\n\nimport Button from '../Button';\nimport Icon, { registerIcon } from '../Icon';\nimport * as plusIcon from '../Icon/icons/plus.icon';\nimport * as minusIcon from '../Icon/icons/minus.icon';\nimport Flex from '../Flex';\nimport FormField from '../FormField';\nimport type { RefElement } from '../../types';\nimport {\n useArrows,\n useConfiguration,\n useConsolidatedRef,\n useI18n,\n useInputFormatter,\n useTestIds,\n useUID\n} from '../../hooks';\nimport StyledInput from '../Input/Input.styles';\nimport { withTestIds } from '../../utils';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\n\nimport StyledNumberInput, { StyledStepperInput } from './NumberInput.styles';\nimport { NUMBER_MAX_DECIMAL_PLACES } from './NumberInput.types';\nimport type { NumberInputProps } from './NumberInput.types';\nimport {\n getCleanedValue,\n getDecimalSign,\n getDecrementedValue,\n getFormattedValue,\n getIncrementedValue\n} from './utils';\nimport { getNumberInputTestIds } from './Number.test-ids';\n\nregisterIcon(minusIcon, plusIcon);\n\nexport default withTestIds(\n forwardRef<RefElement<NumberInputProps>, PropsWithoutRef<NumberInputProps>>(\n function NumberInput(props, ref) {\n const uid = useUID();\n const {\n testId,\n id = uid,\n status,\n label,\n labelHidden,\n info,\n required,\n disabled,\n readOnly,\n additionalInfo,\n value = '',\n onChange,\n onFocus,\n onBlur,\n onResolveSuggestion,\n unit,\n showDecimal = true,\n numberOfDecimals: numberOfDecimalsProp = NUMBER_MAX_DECIMAL_PLACES,\n showGroupSeparators = true,\n min = Number.MIN_SAFE_INTEGER,\n max = Number.MAX_SAFE_INTEGER,\n step = 1,\n variant,\n 'aria-label': ariaLabel,\n autoFocus,\n ...restProps\n } = props;\n\n const testIds = useTestIds(testId, getNumberInputTestIds);\n\n const { locale } = useConfiguration();\n const inputRef = useConsolidatedRef(ref);\n const containerRef = useRef<HTMLElement>(null);\n const maximumFractionDigits = showDecimal ? numberOfDecimalsProp : 0;\n const decimalSign = useMemo(() => getDecimalSign(locale), [locale]);\n\n const formatValue = useCallback(\n number => {\n return getFormattedValue(number, locale, unit, {\n useGrouping: showGroupSeparators,\n maximumFractionDigits\n });\n },\n [locale, unit, showGroupSeparators, maximumFractionDigits]\n );\n\n const onInputChange = (e: ChangeEvent<HTMLInputElement>) => {\n const inputValue = e.target.value;\n const cleanedInputValue = getCleanedValue(inputValue, decimalSign, maximumFractionDigits);\n if (cleanedInputValue === value) return;\n onChange(cleanedInputValue);\n };\n\n const onKeyDown = (e: KeyboardEvent<HTMLInputElement>) => {\n if (readOnly) return;\n const input = e.currentTarget;\n switch (e.key) {\n case 'ArrowUp':\n e.preventDefault();\n onChange(getIncrementedValue(value, min, max, step));\n break;\n case 'ArrowDown':\n e.preventDefault();\n onChange(getDecrementedValue(value, min, max, step));\n break;\n case decimalSign:\n if (input.value.includes(decimalSign)) {\n if (\n input.selectionStart &&\n input.value.charAt(input.selectionStart) === decimalSign\n ) {\n input.setSelectionRange(input.selectionStart + 1, input.selectionStart + 1);\n }\n e.preventDefault();\n } else if (\n input.selectionStart !== null &&\n !input.value.charAt(input.selectionStart - 1).match(/\\d/)\n ) {\n onChange(\n getCleanedValue(`${input.value}0${decimalSign}`, decimalSign, maximumFractionDigits)\n );\n e.preventDefault();\n }\n break;\n case '-':\n if (value.startsWith('-')) e.preventDefault();\n break;\n default:\n }\n };\n\n const onInputFocusEvent = (e: FocusEvent<HTMLInputElement>) => {\n let parsableValue = value;\n\n if (Number.isNaN(parseFloat(value))) {\n parsableValue = '';\n } else if (value?.endsWith('.')) {\n parsableValue = value.slice(0, -1);\n }\n\n if (e.type === 'focus') onFocus?.(parsableValue);\n else {\n if (parsableValue !== value) {\n onChange(parsableValue);\n }\n\n onBlur?.(parsableValue);\n }\n };\n\n const formattedValue = useInputFormatter(\n inputRef,\n value,\n formatValue,\n `\\\\p{N}${decimalSign}-`\n );\n\n const t = useI18n();\n\n const numberInput = (\n <Flex\n data-testid={testIds.root}\n as={StyledNumberInput}\n hasSuggestion={status === 'pending' && !!onResolveSuggestion}\n container={{ alignItems: 'center', wrap: 'nowrap' }}\n status={status}\n readOnly={readOnly}\n disabled={disabled}\n >\n <StyledInput\n data-testid={testIds.control}\n onChange={onInputChange}\n id={id}\n readOnly={readOnly}\n required={required}\n disabled={disabled}\n {...restProps}\n inputMode='numeric'\n ref={inputRef}\n value={formattedValue}\n onKeyDown={onKeyDown}\n onFocus={onInputFocusEvent}\n onBlur={onInputFocusEvent}\n aria-label={`${ariaLabel || label}. ${unit ? t('measured_in', [unit]) : ''}`}\n maxLength={16}\n autoFocus={autoFocus}\n aria-describedby={info ? `${id}-info` : undefined}\n />\n </Flex>\n );\n\n const onMinusClick = () => {\n onChange?.(getDecrementedValue(value, min, max, step));\n };\n\n const onPlusClick = () => {\n onChange?.(getIncrementedValue(value, min, max, step));\n };\n\n const elementRef = useRef<HTMLElement | null>(null);\n useArrows(elementRef, {\n cycle: false,\n selector: 'button, input',\n dir: 'left-right',\n initialFocusElement: inputRef.current\n });\n\n const stepper = (\n <Flex\n as={StyledStepperInput}\n hasSuggestion={status === 'pending' && !!onResolveSuggestion}\n container={{ alignItems: 'center', wrap: 'nowrap' }}\n status={status}\n readOnly={readOnly}\n disabled={disabled}\n size={formattedValue?.length}\n ref={elementRef}\n role='application'\n >\n <Button\n data-testid={testIds.minus}\n variant='simple'\n icon\n onClick={onMinusClick}\n readOnly={readOnly}\n disabled={disabled}\n tabIndex={-1}\n aria-label={t('decrease_value_by', [step])}\n >\n <Icon name='minus' />\n </Button>\n <Flex\n container={{ alignItems: 'center', wrap: 'nowrap', justify: 'center' }}\n item={{ grow: 1 }}\n ref={containerRef}\n onClick={(e: MouseEvent) => {\n if (e.target === containerRef.current) inputRef?.current?.focus();\n }}\n >\n <StyledInput\n data-testid={testIds.control}\n onChange={onInputChange}\n id={id}\n readOnly={readOnly}\n required={required}\n disabled={disabled}\n {...restProps}\n inputMode='numeric'\n ref={inputRef}\n value={formattedValue}\n onKeyDown={onKeyDown}\n onFocus={onInputFocusEvent}\n onBlur={onInputFocusEvent}\n aria-label={`${ariaLabel || label}. ${unit ? t('measured_in', [unit]) : ''}`}\n maxLength={16}\n autoFocus={autoFocus}\n aria-describedby={\n info ? `${id}-info ${id}-input-description` : `${id}-input-description`\n }\n />\n </Flex>\n <Button\n data-testid={testIds.plus}\n variant='simple'\n icon\n onClick={onPlusClick}\n readOnly={readOnly}\n disabled={disabled}\n tabIndex={-1}\n aria-label={t('increase_value_by', [step])}\n >\n <Icon name='plus' />\n </Button>\n <VisuallyHiddenText id={`${id}-input-description`}>\n {t('stepper_instructions')}\n </VisuallyHiddenText>\n <VisuallyHiddenText aria-live='polite'>{formattedValue}</VisuallyHiddenText>\n </Flex>\n );\n\n const Comp = variant === 'stepper' && !readOnly ? stepper : numberInput;\n\n return label ? (\n <FormField\n testId={testIds}\n label={label}\n labelHidden={labelHidden}\n id={id}\n info={info}\n status={status}\n required={required}\n readOnly={readOnly}\n disabled={disabled}\n additionalInfo={additionalInfo}\n onResolveSuggestion={onResolveSuggestion}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n );\n }\n ),\n getNumberInputTestIds\n);\n"]}
|
|
1
|
+
{"version":3,"file":"NumberInput.js","sourceRoot":"","sources":["../../../src/components/Number/NumberInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useCallback, useMemo, useRef } from 'react';\nimport type { ChangeEvent, KeyboardEvent, PropsWithoutRef, FocusEvent } from 'react';\n\nimport Button from '../Button';\nimport Icon, { registerIcon } from '../Icon';\nimport * as plusIcon from '../Icon/icons/plus.icon';\nimport * as minusIcon from '../Icon/icons/minus.icon';\nimport Flex from '../Flex';\nimport FormField from '../FormField';\nimport type { RefElement } from '../../types';\nimport {\n useArrows,\n useConfiguration,\n useConsolidatedRef,\n useI18n,\n useInputFormatter,\n useTestIds,\n useUID\n} from '../../hooks';\nimport Input from '../Input';\nimport { withTestIds } from '../../utils';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\n\nimport StyledNumberInput, { StyledStepperInput } from './NumberInput.styles';\nimport { NUMBER_MAX_DECIMAL_PLACES } from './NumberInput.types';\nimport type { NumberInputProps } from './NumberInput.types';\nimport {\n getCleanedValue,\n getDecimalSign,\n getDecrementedValue,\n getFormattedValue,\n getIncrementedValue\n} from './utils';\nimport { getNumberInputTestIds } from './Number.test-ids';\n\nregisterIcon(minusIcon, plusIcon);\n\nexport default withTestIds(\n forwardRef<RefElement<NumberInputProps>, PropsWithoutRef<NumberInputProps>>(\n function NumberInput(props, ref) {\n const uid = useUID();\n const {\n testId,\n id = uid,\n status,\n label,\n labelHidden,\n info,\n required,\n disabled,\n readOnly,\n additionalInfo,\n value = '',\n onChange,\n onFocus,\n onBlur,\n onResolveSuggestion,\n unit,\n showDecimal = true,\n numberOfDecimals: numberOfDecimalsProp = NUMBER_MAX_DECIMAL_PLACES,\n showGroupSeparators = true,\n min = Number.MIN_SAFE_INTEGER,\n max = Number.MAX_SAFE_INTEGER,\n step = 1,\n variant,\n 'aria-label': ariaLabel,\n autoFocus,\n defaultValue,\n ...restProps\n } = props;\n\n const testIds = useTestIds(testId, getNumberInputTestIds);\n\n const { locale } = useConfiguration();\n const inputRef = useConsolidatedRef(ref);\n const containerRef = useRef<HTMLElement>(null);\n const maximumFractionDigits = showDecimal ? numberOfDecimalsProp : 0;\n const decimalSign = useMemo(\n () => getDecimalSign(locale, { numberingSystem: 'latn' }),\n [locale]\n );\n\n const formatValue = useCallback(\n number => {\n return getFormattedValue(number, locale, unit, {\n useGrouping: showGroupSeparators,\n maximumFractionDigits\n });\n },\n [locale, unit, showGroupSeparators, maximumFractionDigits]\n );\n\n const onInputChange = (e: ChangeEvent<HTMLInputElement>) => {\n const inputValue = e.target.value;\n const cleanedInputValue = getCleanedValue(inputValue, locale, maximumFractionDigits);\n if (cleanedInputValue === value) return;\n onChange(cleanedInputValue);\n };\n\n const onKeyDown = (e: KeyboardEvent<HTMLInputElement>) => {\n if (readOnly) return;\n const input = e.currentTarget;\n switch (e.key) {\n case 'ArrowUp':\n e.preventDefault();\n onChange(getIncrementedValue(value, min, max, step));\n break;\n case 'ArrowDown':\n e.preventDefault();\n onChange(getDecrementedValue(value, min, max, step));\n break;\n case decimalSign:\n if (input.value.includes(decimalSign)) {\n if (\n input.selectionStart &&\n input.value.charAt(input.selectionStart) === decimalSign\n ) {\n input.setSelectionRange(input.selectionStart + 1, input.selectionStart + 1);\n }\n e.preventDefault();\n } else if (\n input.selectionStart !== null &&\n !input.value.charAt(input.selectionStart - 1).match(/\\d/)\n ) {\n onChange(\n getCleanedValue(`${input.value}0${decimalSign}`, locale, maximumFractionDigits)\n );\n e.preventDefault();\n }\n break;\n case '-':\n if (value.startsWith('-')) e.preventDefault();\n break;\n default:\n }\n };\n\n const onInputFocusEvent = (e: FocusEvent<HTMLInputElement>) => {\n let parsableValue = value;\n\n if (Number.isNaN(parseFloat(value))) {\n parsableValue = '';\n } else if (value?.endsWith('.')) {\n parsableValue = value.slice(0, -1);\n }\n\n if (e.type === 'focus') onFocus?.(parsableValue);\n else {\n if (parsableValue !== value) {\n onChange(parsableValue);\n }\n\n onBlur?.(parsableValue);\n }\n };\n\n const formattedValue = useInputFormatter(inputRef, value, formatValue, `0-9${decimalSign}-`);\n\n const t = useI18n();\n\n const numberInput = (\n <Flex\n data-testid={testIds.root}\n as={StyledNumberInput}\n hasSuggestion={status === 'pending' && !!onResolveSuggestion}\n container={{ alignItems: 'center', wrap: 'nowrap' }}\n status={status}\n readOnly={readOnly}\n disabled={disabled}\n >\n <Input\n data-testid={testIds.control}\n onChange={onInputChange}\n id={id}\n readOnly={readOnly}\n required={required}\n disabled={disabled}\n {...restProps}\n inputMode='numeric'\n ref={inputRef}\n value={formattedValue}\n onKeyDown={onKeyDown}\n onFocus={onInputFocusEvent}\n onBlur={onInputFocusEvent}\n aria-label={`${ariaLabel || label}. ${unit ? t('measured_in', [unit]) : ''}`}\n maxLength={16}\n autoFocus={autoFocus}\n aria-describedby={info ? `${id}-info` : undefined}\n />\n </Flex>\n );\n\n const onMinusClick = () => {\n onChange?.(getDecrementedValue(value, min, max, step));\n };\n\n const onPlusClick = () => {\n onChange?.(getIncrementedValue(value, min, max, step));\n };\n\n const elementRef = useRef<HTMLElement | null>(null);\n useArrows(elementRef, {\n cycle: false,\n selector: 'button, input',\n dir: 'left-right',\n initialFocusElement: inputRef.current\n });\n\n const stepper = (\n <Flex\n as={StyledStepperInput}\n hasSuggestion={status === 'pending' && !!onResolveSuggestion}\n container={{ alignItems: 'center', wrap: 'nowrap' }}\n status={status}\n readOnly={readOnly}\n disabled={disabled}\n size={formattedValue?.length}\n ref={elementRef}\n role='application'\n >\n <Button\n data-testid={testIds.minus}\n variant='simple'\n icon\n onClick={onMinusClick}\n readOnly={readOnly}\n disabled={disabled}\n tabIndex={-1}\n aria-label={t('decrease_value_by', [step])}\n >\n <Icon name='minus' />\n </Button>\n <Flex\n container={{ alignItems: 'center', wrap: 'nowrap', justify: 'center' }}\n item={{ grow: 1 }}\n ref={containerRef}\n onClick={(e: MouseEvent) => {\n if (e.target === containerRef.current) inputRef?.current?.focus();\n }}\n >\n <Input\n data-testid={testIds.control}\n onChange={onInputChange}\n id={id}\n readOnly={readOnly}\n required={required}\n disabled={disabled}\n {...restProps}\n inputMode='numeric'\n ref={inputRef}\n value={formattedValue}\n onKeyDown={onKeyDown}\n onFocus={onInputFocusEvent}\n onBlur={onInputFocusEvent}\n aria-label={`${ariaLabel || label}. ${unit ? t('measured_in', [unit]) : ''}`}\n maxLength={16}\n autoFocus={autoFocus}\n aria-describedby={\n info ? `${id}-info ${id}-input-description` : `${id}-input-description`\n }\n />\n </Flex>\n <Button\n data-testid={testIds.plus}\n variant='simple'\n icon\n onClick={onPlusClick}\n readOnly={readOnly}\n disabled={disabled}\n tabIndex={-1}\n aria-label={t('increase_value_by', [step])}\n >\n <Icon name='plus' />\n </Button>\n <VisuallyHiddenText id={`${id}-input-description`}>\n {t('stepper_instructions')}\n </VisuallyHiddenText>\n <VisuallyHiddenText aria-live='polite'>{formattedValue}</VisuallyHiddenText>\n </Flex>\n );\n\n const Comp = variant === 'stepper' && !readOnly ? stepper : numberInput;\n\n return label ? (\n <FormField\n testId={testIds}\n label={label}\n labelHidden={labelHidden}\n id={id}\n info={info}\n status={status}\n required={required}\n readOnly={readOnly}\n disabled={disabled}\n additionalInfo={additionalInfo}\n onResolveSuggestion={onResolveSuggestion}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n );\n }\n ),\n getNumberInputTestIds\n);\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NumberInput.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Number/NumberInput.styles.ts"],"names":[],"mappings":"AASA,UAAU,kBAAkB;IAC1B,IAAI,EAAE,MAAM,CAAC;CACd;AAED,eAAO,MAAM,kBAAkB;;
|
|
1
|
+
{"version":3,"file":"NumberInput.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Number/NumberInput.styles.ts"],"names":[],"mappings":"AASA,UAAU,kBAAkB;IAC1B,IAAI,EAAE,MAAM,CAAC;CACd;AAED,eAAO,MAAM,kBAAkB;;8BA2D7B,CAAC;AAIH,QAAA,MAAM,iBAAiB;;SA6CrB,CAAC;AAIH,eAAe,iBAAiB,CAAC"}
|
|
@@ -12,11 +12,13 @@ export const StyledStepperInput = styled(StyledFormControl)(props => {
|
|
|
12
12
|
border-color: ${focusBorderColor};
|
|
13
13
|
box-shadow: ${shadow};
|
|
14
14
|
}
|
|
15
|
+
|
|
15
16
|
${StyledFlex} {
|
|
16
17
|
overflow: auto;
|
|
17
18
|
margin-inline-start: ${spacing};
|
|
18
19
|
margin-inline-end: ${spacing};
|
|
19
20
|
}
|
|
21
|
+
|
|
20
22
|
${StyledInput} {
|
|
21
23
|
color: ${fgColor};
|
|
22
24
|
width: ${size}ch;
|
|
@@ -31,10 +33,12 @@ export const StyledStepperInput = styled(StyledFormControl)(props => {
|
|
|
31
33
|
box-shadow: none;
|
|
32
34
|
}
|
|
33
35
|
}
|
|
36
|
+
|
|
34
37
|
${StyledText} {
|
|
35
38
|
padding: 0 calc(0.5 * ${spacing});
|
|
36
39
|
white-space: nowrap;
|
|
37
40
|
}
|
|
41
|
+
|
|
38
42
|
> ${StyledButton} {
|
|
39
43
|
border-radius: calc(${baseBorderRadius} * ${formBorderRadius});
|
|
40
44
|
margin-inline-start: auto;
|
|
@@ -56,6 +60,7 @@ const StyledNumberInput = styled(StyledFormControl)(props => {
|
|
|
56
60
|
border-color: ${focusBorderColor};
|
|
57
61
|
box-shadow: ${shadow};
|
|
58
62
|
}
|
|
63
|
+
|
|
59
64
|
${StyledInput} {
|
|
60
65
|
color: inherit;
|
|
61
66
|
outline: none;
|
|
@@ -67,7 +72,14 @@ const StyledNumberInput = styled(StyledFormControl)(props => {
|
|
|
67
72
|
&:focus:not([disabled]) {
|
|
68
73
|
box-shadow: none;
|
|
69
74
|
}
|
|
75
|
+
|
|
76
|
+
/* Numbers are written left-to-right even in RTL languages. */
|
|
77
|
+
direction: ltr;
|
|
78
|
+
:dir(rtl) {
|
|
79
|
+
text-align: right;
|
|
80
|
+
}
|
|
70
81
|
}
|
|
82
|
+
|
|
71
83
|
${StyledText} {
|
|
72
84
|
padding: 0 calc(0.5 * ${spacing});
|
|
73
85
|
white-space: nowrap;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NumberInput.styles.js","sourceRoot":"","sources":["../../../src/components/Number/NumberInput.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACnD,OAAO,WAAW,MAAM,uBAAuB,CAAC;AAChD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AACzC,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAMrC,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,iBAAiB,CAAC,CAAqB,KAAK,CAAC,EAAE;IACtF,MAAM,EACJ,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,OAAO,EAAE,eAAe,EAAE,gBAAgB,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,EAAE,EAClF,UAAU,EAAE,EACV,KAAK,EAAE,EAAE,MAAM,EAAE,EACjB,cAAc,EAAE,EACd,eAAe,EAAE,gBAAgB,EACjC,kBAAkB,EAAE,OAAO,EAC3B,cAAc,EAAE,WAAW,EAC3B,QAAQ,EAAE,EAAE,cAAc,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,EAAE,EACrE,EACF,EACF,EACD,IAAI,EACL,GAAG,KAAK,CAAC;IACV,OAAO,GAAG,CAAA;;sBAEU,gBAAgB;oBAClB,MAAM
|
|
1
|
+
{"version":3,"file":"NumberInput.styles.js","sourceRoot":"","sources":["../../../src/components/Number/NumberInput.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACnD,OAAO,WAAW,MAAM,uBAAuB,CAAC;AAChD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AACzC,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAMrC,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,iBAAiB,CAAC,CAAqB,KAAK,CAAC,EAAE;IACtF,MAAM,EACJ,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,OAAO,EAAE,eAAe,EAAE,gBAAgB,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,EAAE,EAClF,UAAU,EAAE,EACV,KAAK,EAAE,EAAE,MAAM,EAAE,EACjB,cAAc,EAAE,EACd,eAAe,EAAE,gBAAgB,EACjC,kBAAkB,EAAE,OAAO,EAC3B,cAAc,EAAE,WAAW,EAC3B,QAAQ,EAAE,EAAE,cAAc,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,EAAE,EACrE,EACF,EACF,EACD,IAAI,EACL,GAAG,KAAK,CAAC;IACV,OAAO,GAAG,CAAA;;sBAEU,gBAAgB;oBAClB,MAAM;;;MAGpB,UAAU;;6BAEa,OAAO;2BACT,OAAO;;;MAG5B,WAAW;eACF,OAAO;eACP,IAAI;;;;;0BAKO,OAAO,CAAC,oBAAoB,CAAC;qBAClC,MAAM,UAAU,WAAW;yBACvB,OAAO,CAAC,WAAW,CAAC,UAAU,WAAW;;;;;;MAM5D,UAAU;8BACc,OAAO;;;;QAI7B,YAAY;4BACQ,gBAAgB,MAAM,gBAAgB;;;;iBAIjD,OAAO;;qBAEH,MAAM,UAAU,WAAW;yBACvB,OAAO,CAAC,WAAW,CAAC,UAAU,WAAW;;GAE/D,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,kBAAkB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEnD,MAAM,iBAAiB,GAAG,MAAM,CAAC,iBAAiB,CAAC,CAAC,KAAK,CAAC,EAAE;IAC1D,MAAM,EACJ,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,EACtC,UAAU,EAAE,EACV,cAAc,EAAE,EACd,QAAQ,EAAE,EAAE,cAAc,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,EAAE,EACpE,cAAc,EAAE,WAAW,EAC5B,EACD,KAAK,EAAE,EAAE,MAAM,EAAE,EAClB,EACF,EACF,GAAG,KAAK,CAAC;IAEV,OAAO,GAAG,CAAA;4BACgB,OAAO;;sBAEb,gBAAgB;oBAClB,MAAM;;;MAGpB,WAAW;;;;8BAIa,OAAO;;qBAEhB,MAAM,UAAU,WAAW;yBACvB,OAAO,CAAC,WAAW,CAAC,UAAU,WAAW;;;;;;;;;;;;MAY5D,UAAU;8BACc,OAAO;;;GAGlC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,iBAAiB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAElD,eAAe,iBAAiB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { StyledFormControl } from '../FormControl';\nimport StyledInput from '../Input/Input.styles';\nimport { StyledText } from '../Text/Text';\nimport { defaultThemeProp } from '../../theme';\nimport { StyledButton } from '../Button';\nimport { StyledFlex } from '../Flex';\n\ninterface StyledStepperProps {\n size: number;\n}\n\nexport const StyledStepperInput = styled(StyledFormControl)<StyledStepperProps>(props => {\n const {\n theme: {\n base: { spacing, 'border-radius': baseBorderRadius, 'hit-area': hitArea, palette },\n components: {\n input: { height },\n 'form-control': {\n 'border-radius': formBorderRadius,\n 'foreground-color': fgColor,\n 'border-width': borderWidth,\n ':focus': { 'border-color': focusBorderColor, 'box-shadow': shadow }\n }\n }\n },\n size\n } = props;\n return css`\n &:focus-within:not([disabled]) {\n border-color: ${focusBorderColor};\n box-shadow: ${shadow};\n }\n\n ${StyledFlex} {\n overflow: auto;\n margin-inline-start: ${spacing};\n margin-inline-end: ${spacing};\n }\n\n ${StyledInput} {\n color: ${fgColor};\n width: ${size}ch;\n min-width: 1ch;\n outline: none;\n border: 0;\n padding: 0;\n background-color: ${palette['primary-background']};\n height: calc(${height} - 2 * ${borderWidth});\n min-height: calc(${hitArea['mouse-min']} - 2 * ${borderWidth});\n &:focus:not([disabled]) {\n box-shadow: none;\n }\n }\n\n ${StyledText} {\n padding: 0 calc(0.5 * ${spacing});\n white-space: nowrap;\n }\n\n > ${StyledButton} {\n border-radius: calc(${baseBorderRadius} * ${formBorderRadius});\n margin-inline-start: auto;\n border: 0;\n &:enabled {\n color: ${fgColor};\n }\n height: calc(${height} - 2 * ${borderWidth});\n min-height: calc(${hitArea['mouse-min']} - 2 * ${borderWidth});\n }\n `;\n});\n\nStyledStepperInput.defaultProps = defaultThemeProp;\n\nconst StyledNumberInput = styled(StyledFormControl)(props => {\n const {\n theme: {\n base: { spacing, 'hit-area': hitArea },\n components: {\n 'form-control': {\n ':focus': { 'border-color': focusBorderColor, 'box-shadow': shadow },\n 'border-width': borderWidth\n },\n input: { height }\n }\n }\n } = props;\n\n return css`\n padding: 0 calc(0.5 * ${spacing});\n &:focus-within:not([disabled]) {\n border-color: ${focusBorderColor};\n box-shadow: ${shadow};\n }\n\n ${StyledInput} {\n color: inherit;\n outline: none;\n border: 0;\n padding: 0 calc(0.5 * ${spacing});\n background-color: initial;\n height: calc(${height} - 2 * ${borderWidth});\n min-height: calc(${hitArea['mouse-min']} - 2 * ${borderWidth});\n &:focus:not([disabled]) {\n box-shadow: none;\n }\n\n /* Numbers are written left-to-right even in RTL languages. */\n direction: ltr;\n :dir(rtl) {\n text-align: right;\n }\n }\n\n ${StyledText} {\n padding: 0 calc(0.5 * ${spacing});\n white-space: nowrap;\n }\n `;\n});\n\nStyledNumberInput.defaultProps = defaultThemeProp;\n\nexport default StyledNumberInput;\n"]}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
export declare function getDecimalSign(locale:
|
|
1
|
+
export declare function getDecimalSign(locale: Intl.UnicodeBCP47LocaleIdentifier, options?: Intl.NumberFormatOptions): string;
|
|
2
2
|
export declare function getFraction(value: string): string;
|
|
3
|
-
export declare function getCleanedValue(value: string,
|
|
3
|
+
export declare function getCleanedValue(value: string, locale: Intl.UnicodeBCP47LocaleIdentifier, maximumFractionDigits: number): string;
|
|
4
4
|
export declare const getFormattedValue: (value: string, locale: string, unit?: string, { notation, useGrouping, maximumFractionDigits, minimumFractionDigits }?: Pick<Intl.NumberFormatOptions, 'notation' | 'useGrouping' | 'maximumFractionDigits' | 'minimumFractionDigits'>) => string;
|
|
5
5
|
export declare function isValueInRange(value: number, min?: number, max?: number): boolean;
|
|
6
6
|
export declare function getIncrementedValue(value: string, min: number, max: number, step: number): string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/components/Number/utils.ts"],"names":[],"mappings":"AAEA,wBAAgB,cAAc,
|
|
1
|
+
{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/components/Number/utils.ts"],"names":[],"mappings":"AAEA,wBAAgB,cAAc,CAC5B,MAAM,EAAE,IAAI,CAAC,4BAA4B,EACzC,OAAO,CAAC,EAAE,IAAI,CAAC,mBAAmB,GACjC,MAAM,CAMR;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,MAAM,UAIxC;AAED,wBAAgB,eAAe,CAC7B,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,IAAI,CAAC,4BAA4B,EACzC,qBAAqB,EAAE,MAAM,GAC5B,MAAM,CASR;AAYD,eAAO,MAAM,iBAAiB,UACrB,MAAM,UACL,MAAM,SACP,MAAM,4EAMV,KACD,wBAAwB,EACxB,UAAU,GAAG,aAAa,GAAG,uBAAuB,GAAG,uBAAuB,CAC/E,WAsCF,CAAC;AAEF,wBAAgB,cAAc,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,CAAC,EAAE,MAAM,EAAE,GAAG,CAAC,EAAE,MAAM,GAAG,OAAO,CAEjF;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,MAAM,CAUjG;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,MAAM,CAUjG;AAED,UAAU,mBAAmB;IAC3B,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,IAAI,CAAC,mBAAmB,CAAC;CACpC;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,mBAAmB,UAI5F"}
|
|
@@ -9,7 +9,8 @@ export function getFraction(value) {
|
|
|
9
9
|
const substrLength = decPos === -1 ? value.length : decPos;
|
|
10
10
|
return value.substring(substrLength);
|
|
11
11
|
}
|
|
12
|
-
export function getCleanedValue(value,
|
|
12
|
+
export function getCleanedValue(value, locale, maximumFractionDigits) {
|
|
13
|
+
const decimalSign = getDecimalSign(locale, { numberingSystem: 'latn' });
|
|
13
14
|
let rawValue = value.replace(new RegExp(`[^${decimalSign}\\d-]+`, 'gu'), '');
|
|
14
15
|
if (decimalSign && decimalSign !== '.')
|
|
15
16
|
rawValue = rawValue.replace(decimalSign, '.');
|
|
@@ -38,7 +39,8 @@ export const getFormattedValue = (value, locale, unit, { notation = 'standard',
|
|
|
38
39
|
minimumFractionDigits: minimumFractionDigits ?? Math.min(maximumFractionDigits ?? 0, fractionPart?.length ?? 0),
|
|
39
40
|
maximumFractionDigits,
|
|
40
41
|
style: isUnit ? 'unit' : undefined,
|
|
41
|
-
unit: isUnit ? unit : undefined
|
|
42
|
+
unit: isUnit ? unit : undefined,
|
|
43
|
+
numberingSystem: 'latn'
|
|
42
44
|
});
|
|
43
45
|
let formatted = value;
|
|
44
46
|
if (value && !Number.isNaN(parseFloat(integer))) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/components/Number/utils.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,cAAc,CAAC;AAErC,MAAM,UAAU,cAAc,
|
|
1
|
+
{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/components/Number/utils.ts"],"names":[],"mappings":"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","sourcesContent":["import BigNumber from 'bignumber.js';\n\nexport function getDecimalSign(\n locale: Intl.UnicodeBCP47LocaleIdentifier,\n options?: Intl.NumberFormatOptions\n): string {\n return (\n new Intl.NumberFormat(locale, options)\n .formatToParts(0.1)\n .filter((part: { type: string; value: string }) => part.type === 'decimal')[0]?.value || ''\n );\n}\n\nexport function getFraction(value: string) {\n const decPos = value.indexOf('.');\n const substrLength = decPos === -1 ? value.length : decPos;\n return value.substring(substrLength);\n}\n\nexport function getCleanedValue(\n value: string,\n locale: Intl.UnicodeBCP47LocaleIdentifier,\n maximumFractionDigits: number\n): string {\n const decimalSign = getDecimalSign(locale, { numberingSystem: 'latn' });\n let rawValue = value.replace(new RegExp(`[^${decimalSign}\\\\d-]+`, 'gu'), '');\n if (decimalSign && decimalSign !== '.') rawValue = rawValue.replace(decimalSign, '.');\n const match = rawValue.match(new RegExp(`-?\\\\d*(\\\\.\\\\d{0,${maximumFractionDigits}})?`));\n if (match && match.length > 0) {\n rawValue = match[0];\n }\n return rawValue;\n}\n\nconst isValidUnit = (unit: string) => {\n try {\n // eslint-disable-next-line no-new\n new Intl.NumberFormat(undefined, { style: 'unit', unit });\n return true;\n } catch {\n return false;\n }\n};\n\nexport const getFormattedValue = (\n value: string,\n locale: string,\n unit?: string,\n {\n notation = 'standard',\n useGrouping = false,\n maximumFractionDigits,\n minimumFractionDigits\n }: Pick<\n Intl.NumberFormatOptions,\n 'notation' | 'useGrouping' | 'maximumFractionDigits' | 'minimumFractionDigits'\n > = {}\n) => {\n const isUnit = unit ? isValidUnit(unit) : false;\n const [integer, fractionPart] = value.split('.', 2) as [string, string?];\n\n const formatter = new Intl.NumberFormat(locale, {\n notation,\n useGrouping,\n minimumFractionDigits:\n minimumFractionDigits ?? Math.min(maximumFractionDigits ?? 0, fractionPart?.length ?? 0),\n maximumFractionDigits,\n style: isUnit ? 'unit' : undefined,\n unit: isUnit ? unit : undefined,\n numberingSystem: 'latn'\n });\n\n let formatted = value;\n\n if (value && !Number.isNaN(parseFloat(integer))) {\n const endsWithDot = fractionPart === '';\n const valueNumber = Number(endsWithDot ? `${value}1` : value);\n formatted =\n formatter.formatToParts(valueNumber).reduce((result, { type, value: part }) => {\n if (type === 'fraction' && endsWithDot) return result;\n return result + part;\n }, '') + (!isUnit && unit ? `\\u00a0${unit}` : '');\n } else if (unit) {\n if (isUnit)\n formatted = formatter\n .formatToParts(value.startsWith('-') ? -1 : 1)\n .reduce(\n (result, { type, value: part }) =>\n ['unit', 'minusSign'].includes(type) ? result + part : result,\n ''\n );\n else formatted = value.startsWith('-') ? `- ${unit}` : unit;\n }\n return formatted;\n};\n\nexport function isValueInRange(value: number, min?: number, max?: number): boolean {\n return !((min !== undefined && value < min) || (max !== undefined && value > max));\n}\n\nexport function getIncrementedValue(value: string, min: number, max: number, step: number): string {\n const numberValue = parseFloat(value) || 0;\n const newValue = new BigNumber(numberValue).plus(step);\n if (isValueInRange(newValue.toNumber(), min, max)) {\n return newValue.toFixed();\n }\n if (min !== undefined && newValue.toNumber() < min) {\n return min.toString();\n }\n return value;\n}\n\nexport function getDecrementedValue(value: string, min: number, max: number, step: number): string {\n const numberValue = parseFloat(value) || 0;\n const newValue = new BigNumber(numberValue).minus(step);\n if (isValueInRange(newValue.toNumber(), min, max)) {\n return newValue.toFixed();\n }\n if (max !== undefined && newValue.toNumber() > max) {\n return max.toString();\n }\n return value;\n}\n\ninterface NumberFormatOptions {\n locale: string;\n options?: Intl.NumberFormatOptions;\n}\n\nexport function formatNumber(value: number | bigint, { locale, options }: NumberFormatOptions) {\n const formatter = new Intl.NumberFormat(locale, options);\n\n return formatter.format(value);\n}\n"]}
|
package/lib/hooks/useI18n.d.ts
CHANGED
|
@@ -1044,6 +1044,26 @@ declare const useI18n: () => import("../i18n/translate").TranslationFunction<Rea
|
|
|
1044
1044
|
condition_builder_value_label: string;
|
|
1045
1045
|
condition_builder_field_label: string;
|
|
1046
1046
|
condition_builder_comparator_label: string;
|
|
1047
|
+
condition_builder_comparator_is_true: string;
|
|
1048
|
+
condition_builder_comparator_is_false: string;
|
|
1049
|
+
condition_builder_comparator_is_equal_to: string;
|
|
1050
|
+
condition_builder_comparator_is_not_equal_to: string;
|
|
1051
|
+
condition_builder_comparator_is_null: string;
|
|
1052
|
+
condition_builder_comparator_is_not_null: string;
|
|
1053
|
+
condition_builder_comparator_is_in_list: string;
|
|
1054
|
+
condition_builder_comparator_is_not_in_list: string;
|
|
1055
|
+
condition_builder_comparator_starts_with: string;
|
|
1056
|
+
condition_builder_comparator_not_starts_with: string;
|
|
1057
|
+
condition_builder_comparator_ends_with: string;
|
|
1058
|
+
condition_builder_comparator_not_ends_with: string;
|
|
1059
|
+
condition_builder_comparator_contains: string;
|
|
1060
|
+
condition_builder_comparator_not_contains: string;
|
|
1061
|
+
condition_builder_comparator_between: string;
|
|
1062
|
+
condition_builder_comparator_not_between: string;
|
|
1063
|
+
condition_builder_comparator_greater_than: string;
|
|
1064
|
+
condition_builder_comparator_greater_than_or_equals: string;
|
|
1065
|
+
condition_builder_comparator_lower_than: string;
|
|
1066
|
+
condition_builder_comparator_lower_than_or_equals: string;
|
|
1047
1067
|
promoted_filters_clear_all_button_label: string;
|
|
1048
1068
|
dev_mode: string;
|
|
1049
1069
|
expand_navigation: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useI18n.d.ts","sourceRoot":"","sources":["../../src/hooks/useI18n.ts"],"names":[],"mappings":"AAMA;;;GAGG;AACH,QAAA,MAAM,OAAO
|
|
1
|
+
{"version":3,"file":"useI18n.d.ts","sourceRoot":"","sources":["../../src/hooks/useI18n.ts"],"names":[],"mappings":"AAMA;;;GAGG;AACH,QAAA,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAGZ,CAAC;AAEF,eAAe,OAAO,CAAC"}
|
package/lib/i18n/default.d.ts
CHANGED
|
@@ -1040,6 +1040,26 @@ declare const _default: {
|
|
|
1040
1040
|
condition_builder_value_label: string;
|
|
1041
1041
|
condition_builder_field_label: string;
|
|
1042
1042
|
condition_builder_comparator_label: string;
|
|
1043
|
+
condition_builder_comparator_is_true: string;
|
|
1044
|
+
condition_builder_comparator_is_false: string;
|
|
1045
|
+
condition_builder_comparator_is_equal_to: string;
|
|
1046
|
+
condition_builder_comparator_is_not_equal_to: string;
|
|
1047
|
+
condition_builder_comparator_is_null: string;
|
|
1048
|
+
condition_builder_comparator_is_not_null: string;
|
|
1049
|
+
condition_builder_comparator_is_in_list: string;
|
|
1050
|
+
condition_builder_comparator_is_not_in_list: string;
|
|
1051
|
+
condition_builder_comparator_starts_with: string;
|
|
1052
|
+
condition_builder_comparator_not_starts_with: string;
|
|
1053
|
+
condition_builder_comparator_ends_with: string;
|
|
1054
|
+
condition_builder_comparator_not_ends_with: string;
|
|
1055
|
+
condition_builder_comparator_contains: string;
|
|
1056
|
+
condition_builder_comparator_not_contains: string;
|
|
1057
|
+
condition_builder_comparator_between: string;
|
|
1058
|
+
condition_builder_comparator_not_between: string;
|
|
1059
|
+
condition_builder_comparator_greater_than: string;
|
|
1060
|
+
condition_builder_comparator_greater_than_or_equals: string;
|
|
1061
|
+
condition_builder_comparator_lower_than: string;
|
|
1062
|
+
condition_builder_comparator_lower_than_or_equals: string;
|
|
1043
1063
|
promoted_filters_clear_all_button_label: string;
|
|
1044
1064
|
dev_mode: string;
|
|
1045
1065
|
expand_navigation: string;
|