npm - @pega/cosmos-react-core - Versions diffs - 2.0.0-dev.18.0 → 2.0.0-dev.20.0 - Mend

@pega/cosmos-react-core 2.0.0-dev.18.0 → 2.0.0-dev.20.0

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.

Files changed (331) hide show

package/lib/components/Phone/PhoneInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PhoneInput.js","sourceRoot":"","sources":["../../../src/components/Phone/PhoneInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n ChangeEvent,\n forwardRef,\n FunctionComponent,\n PropsWithoutRef,\n Ref,\n useEffect,\n useMemo,\n useRef,\n useState\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { useAfterInitialEffect, useDirection, useFocusWithin } from '../../hooks';\nimport { defaultThemeProp } from '../../theme';\nimport { BaseProps, ForwardProps, PropsWithDefaults } from '../../types';\nimport FormField from '../FormField';\nimport { FormControlProps, StyledFormControl } from '../FormControl';\nimport StyledInput from '../Input/Input.styles';\nimport Select, { Option } from '../Select';\nimport Input from '../Input';\nimport { StyledSelect } from '../Select/Select';\nimport Flex from '../Flex';\n\nimport callingCodes from './callingCodes';\nimport {\n calculateCursorPosition,\n convertToCallbackParameter,\n formatPhoneNumber,\n getPhoneNumberParts\n} from './utils';\n\nexport interface PhoneInputProps extends FormControlProps, BaseProps {\n /*\n Display select with countries calling codes\n * @default false\n /\n showCountryCode?: boolean;\n /* Changes lists of countries calling codes /\n callingCodesList?: string[];\n /* Callback fired on input value change /\n onChange?: (value: string) => void;\n /* Callback fired when the component loses focus /\n onBlur?: (value: string) => void;\n /* CCallback fired when the component gets focus /\n onFocus?: (value: string) => void;\n /* Ref for the wrapping element. */\n ref?: Ref<HTMLDivElement>;\n}\n\ntype PhoneInputPropsWithDefaults = PropsWithDefaults<PhoneInputProps>;\n\nconst StyledPhoneInput = styled.div<PhoneInputPropsWithDefaults>(() => {\n const { start, end } = useDirection();\n return css`\n border: 0;\n > ${StyledSelect} {\n max-width: max-content;\n border-inline-end: none;\n ${`border-top-${end}-radius`}: 0;\n ${`border-bottom-${end}-radius`}: 0;\n }\n\n > ${StyledSelect} + ${StyledInput} {\n ${`border-top-${start}-radius`}: 0;\n ${`border-bottom-${start}-radius`}: 0;\n }\n `;\n});\n\nStyledPhoneInput.defaultProps = defaultThemeProp;\n\nconst PhoneInput: FunctionComponent<PhoneInputProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<PhoneInputProps>, ref: PhoneInputProps['ref']) => {\n const {\n defaultValue,\n value = defaultValue,\n id,\n label,\n labelHidden,\n info,\n status,\n required,\n readOnly,\n disabled,\n showCountryCode = false,\n callingCodesList = callingCodes,\n onChange,\n onBlur,\n onFocus,\n ...restProps\n } = props;\n\n const phoneNumberParts = useMemo(() => {\n return value ? getPhoneNumberParts(value, callingCodesList) : undefined;\n }, [callingCodesList, value]);\n\n const [countryCode, setCountryCode] = useState(\n showCountryCode ? phoneNumberParts?.[0] \|\| callingCodesList[0] : phoneNumberParts?.[0]\n );\n\n const [phoneNumber, setPhoneNumber] = useState(\n phoneNumberParts ? formatPhoneNumber(phoneNumberParts[1], countryCode) : ''\n );\n\n useAfterInitialEffect(() => {\n setCountryCode(phoneNumberParts?.[0]);\n setPhoneNumber(phoneNumberParts ? formatPhoneNumber(phoneNumberParts[1], countryCode) : '');\n }, [phoneNumberParts]);\n\n const [cursor, setCursor] = useState<number \| undefined>(undefined);\n const inputRef = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n if (cursor !== undefined) inputRef.current?.setSelectionRange(cursor, cursor);\n }, [cursor, inputRef.current]);\n\n const onFocusChange = (focused: boolean) => {\n const callbackParam = convertToCallbackParameter(countryCode, phoneNumber);\n if (focused) onFocus?.(callbackParam);\n else onBlur?.(callbackParam);\n };\n\n const containerRef = useRef<HTMLElement>(null);\n useFocusWithin([containerRef], onFocusChange);\n\n const onInputChange = (e: ChangeEvent<HTMLInputElement>) => {\n const inputValue = e.target.value;\n const selectionStart = e.target.selectionStart;\n const formatted = formatPhoneNumber(inputValue, countryCode);\n setPhoneNumber(formatted);\n if (countryCode) {\n setCursor(calculateCursorPosition(formatted, phoneNumber, countryCode, selectionStart));\n }\n onChange?.(convertToCallbackParameter(countryCode, formatted));\n };\n\n const onSelectChange = (e: ChangeEvent<HTMLSelectElement>) => {\n const selectValue = e.target.value;\n setCountryCode(selectValue);\n setPhoneNumber(formatPhoneNumber(phoneNumber, selectValue));\n onChange?.(convertToCallbackParameter(selectValue, phoneNumber));\n };\n\n const codesOptions = (\n <>\n {callingCodesList.map(code => (\n <Option key={code} value={code}>\n {code}\n </Option>\n ))}\n </>\n );\n\n const Comp = (\n <StyledPhoneInput\n as={StyledFormControl}\n forwardedAs={Flex as any}\n container={{ alignItems: 'center', wrap: 'nowrap' }}\n ref={containerRef}\n status={status}\n readOnly={readOnly}\n disabled={disabled}\n >\n {showCountryCode && (\n <Select\n value={countryCode}\n onChange={onSelectChange}\n required={required}\n status={status}\n readOnly={readOnly}\n disabled={disabled}\n >\n {codesOptions}\n </Select>\n )}\n <Input\n {...restProps}\n inputMode='tel'\n ref={inputRef}\n value={phoneNumber}\n onChange={onInputChange}\n required={required}\n status={status}\n readOnly={readOnly}\n disabled={disabled}\n />\n </StyledPhoneInput>\n );\n\n return label ? (\n <FormField\n as='fieldset'\n labelAs='legend'\n {...{ label, labelHidden, id, info, ref, status, required, disabled }}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n );\n }\n);\n\nexport default PhoneInput;\n"]}
1	+ {"version":3,"file":"PhoneInput.js","sourceRoot":"","sources":["../../../src/components/Phone/PhoneInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n ChangeEvent,\n forwardRef,\n FunctionComponent,\n PropsWithoutRef,\n Ref,\n useEffect,\n useMemo,\n useRef,\n useState\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { useAfterInitialEffect, useDirection, useFocusWithin } from '../../hooks';\nimport { defaultThemeProp } from '../../theme';\nimport { BaseProps, ForwardProps, PropsWithDefaults } from '../../types';\nimport FormField from '../FormField';\nimport { FormControlProps, StyledFormControl } from '../FormControl';\nimport StyledInput from '../Input/Input.styles';\nimport Select, { Option } from '../Select';\nimport Input from '../Input';\nimport { StyledSelect } from '../Select/Select';\nimport Flex from '../Flex';\n\nimport callingCodes from './callingCodes';\nimport {\n calculateCursorPosition,\n convertToCallbackParameter,\n formatPhoneNumber,\n getPhoneNumberParts\n} from './utils';\n\nexport interface PhoneInputProps extends FormControlProps, BaseProps {\n /*\n Display select with countries calling codes\n * @default false\n /\n showCountryCode?: boolean;\n /* Changes lists of countries calling codes /\n callingCodesList?: string[];\n /* Callback fired on input value change /\n onChange?: (value: string) => void;\n /* Callback fired when the component loses focus /\n onBlur?: (value: string) => void;\n /* CCallback fired when the component gets focus /\n onFocus?: (value: string) => void;\n /* Ref for the wrapping element. */\n ref?: Ref<HTMLDivElement>;\n}\n\ntype PhoneInputPropsWithDefaults = PropsWithDefaults<PhoneInputProps>;\n\nconst StyledPhoneInput = styled.div<PhoneInputPropsWithDefaults>(() => {\n const { start, end } = useDirection();\n return css`\n border: 0;\n > ${StyledSelect} {\n max-width: max-content;\n border-inline-end: none;\n ${`border-top-${end}-radius`}: 0;\n ${`border-bottom-${end}-radius`}: 0;\n }\n\n > ${StyledSelect} + ${StyledInput} {\n ${`border-top-${start}-radius`}: 0;\n ${`border-bottom-${start}-radius`}: 0;\n }\n `;\n});\n\nStyledPhoneInput.defaultProps = defaultThemeProp;\n\nconst PhoneInput: FunctionComponent<PhoneInputProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<PhoneInputProps>, ref: PhoneInputProps['ref']) => {\n const {\n defaultValue,\n value = defaultValue,\n id,\n label,\n labelHidden,\n info,\n status,\n required,\n readOnly,\n disabled,\n showCountryCode = false,\n callingCodesList = callingCodes,\n onChange,\n onBlur,\n onFocus,\n ...restProps\n } = props;\n\n const phoneNumberParts = useMemo(() => {\n return value ? getPhoneNumberParts(value, callingCodesList) : undefined;\n }, [callingCodesList, value]);\n\n const [countryCode, setCountryCode] = useState(\n showCountryCode ? phoneNumberParts?.[0] \|\| callingCodesList[0] : phoneNumberParts?.[0]\n );\n\n const [phoneNumber, setPhoneNumber] = useState(\n phoneNumberParts ? formatPhoneNumber(phoneNumberParts[1], countryCode) : ''\n );\n\n useAfterInitialEffect(() => {\n setCountryCode(phoneNumberParts?.[0]);\n setPhoneNumber(phoneNumberParts ? formatPhoneNumber(phoneNumberParts[1], countryCode) : '');\n }, [phoneNumberParts]);\n\n const [cursor, setCursor] = useState<number \| undefined>(undefined);\n const inputRef = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n if (cursor !== undefined) inputRef.current?.setSelectionRange(cursor, cursor);\n }, [cursor, inputRef.current]);\n\n const onFocusChange = (focused: boolean) => {\n const callbackParam = convertToCallbackParameter(countryCode, phoneNumber);\n if (focused) onFocus?.(callbackParam);\n else onBlur?.(callbackParam);\n };\n\n const containerRef = useRef<HTMLElement>(null);\n useFocusWithin([containerRef], onFocusChange);\n\n const onInputChange = (e: ChangeEvent<HTMLInputElement>) => {\n const inputValue = e.target.value;\n const selectionStart = e.target.selectionStart;\n const formatted = formatPhoneNumber(inputValue, countryCode);\n setPhoneNumber(formatted);\n if (countryCode) {\n setCursor(calculateCursorPosition(formatted, phoneNumber, countryCode, selectionStart));\n }\n onChange?.(convertToCallbackParameter(countryCode, formatted));\n };\n\n const onSelectChange = (e: ChangeEvent<HTMLSelectElement>) => {\n const selectValue = e.target.value;\n setCountryCode(selectValue);\n setPhoneNumber(formatPhoneNumber(phoneNumber, selectValue));\n onChange?.(convertToCallbackParameter(selectValue, phoneNumber));\n };\n\n const codesOptions = (\n <>\n {callingCodesList.map(code => (\n <Option key={code} value={code}>\n {code}\n </Option>\n ))}\n </>\n );\n\n const Comp = (\n <StyledPhoneInput\n as={StyledFormControl}\n forwardedAs={Flex as any}\n container={{ alignItems: 'center', wrap: 'nowrap' }}\n ref={containerRef}\n status={status}\n readOnly={readOnly}\n disabled={disabled}\n >\n {showCountryCode && (\n <Select\n value={countryCode}\n onChange={onSelectChange}\n required={required}\n status={status}\n readOnly={readOnly}\n disabled={disabled}\n >\n {codesOptions}\n </Select>\n )}\n <Input\n {...restProps}\n inputMode='tel'\n ref={inputRef}\n value={phoneNumber}\n onChange={onInputChange}\n required={required}\n status={status}\n readOnly={readOnly}\n disabled={disabled}\n />\n </StyledPhoneInput>\n );\n\n return label ? (\n <FormField\n as='fieldset'\n labelAs='legend'\n {...{ label, labelHidden, id, info, ref, status, required, disabled }}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n );\n }\n);\n\nexport default PhoneInput;\n"]}

package/lib/components/Popover/Popover.js CHANGED Viewed

@@ -76,7 +76,7 @@ const Popover = forwardRef(({ show = true, portal = false, target, placement, st
     useEffect(() => {
         return () => clearTimeout(timeout.current);
     }, []);
-    const content = (_jsxs(StyledPopover, Object.assign({}, restProps, { offset: offset, ref: popperRef, style: { ...style, ...styles.popper } }, attributes.popper, { children: [arrow && _jsx(StyledPopoverArrow, { ref: arrowRef, style: { ...styles.arrow } }, void 0), children] }), void 0));
+    const content = (_jsxs(StyledPopover, { ...restProps, offset: offset, ref: popperRef, style: { ...style, ...styles.popper }, ...attributes.popper, children: [arrow && _jsx(StyledPopoverArrow, { ref: arrowRef, style: { ...styles.arrow } }, void 0), children] }, void 0));
     if (!target || !showPopover || (groupId && !checkActive(uid, groupId)))
         return null;
     return portal && portalTarget ? createPortal(content, portalTarget) : content;

package/lib/components/Popover/Popover.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Popover.js","sourceRoot":"","sources":["../../../src/components/Popover/Popover.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n useContext,\n PropsWithoutRef,\n Ref,\n CSSProperties,\n ReactElement,\n useRef,\n ReactNode,\n useEffect,\n useMemo,\n useState\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { usePopper, PopperProps } from 'react-popper';\nimport { VirtualElement } from '@popperjs/core';\nimport { OffsetModifier } from '@popperjs/core/lib/modifiers/offset';\n\nimport { BaseProps, ForwardProps } from '../../types';\nimport { useConfiguration, useConsolidatedRef, useElement, useUID } from '../../hooks';\nimport { windowIsAvailable } from '../../utils';\n\nimport { PopoverManagerContext } from './PopoverContext';\nimport { StyledPopover, StyledPopoverArrow } from './Popover.styles';\n\nexport type Delay = 'none' \| 'short' \| 'long';\nexport interface PopoverProps<Modifiers extends string = string> extends BaseProps {\n /** The DOM element or [virtual element](https://popper.js.org/docs/v2/virtual-elements) that the Popover is positioned in reference to. /\n target: Element \| VirtualElement \| null;\n /\n If true, the Popover will be visible.\n * @default true\n /\n show?: boolean;\n /\n If true, the Popover will render outside of the current DOM hierarchy in a [portal](https://reactjs.org/docs/portals.html).\n * @default false\n /\n portal?: boolean;\n /\n Delay on showing the Popover.\n * @default \"none\"\n /\n showDelay?: Delay;\n /\n Delay on hiding the Popover.\n * @default \"none\"\n /\n hideDelay?: Delay;\n /\n [React Popper Placement](https://popper.js.org/react-popper/v2/render-props/#placement)\n /\n placement?: PopperProps<Modifiers>['placement'];\n /\n [React Popper Strategy](https://popper.js.org/react-popper/v2/render-props/#strategy)\n * @default \"absolute\"\n /\n strategy?: PopperProps<Modifiers>['strategy'];\n /\n [React Popper Modifiers](https://popper.js.org/react-popper/v2/render-props/#modifiers)\n * @default []\n /\n modifiers?: PopperProps<Modifiers>['modifiers'];\n /\n If true, an arrow will visually identify from which element the Popover is rendered.\n * @default false\n /\n arrow?: boolean;\n /* The group that the Popover belongs to. Popovers in the same group will be closed when others open. /\n groupId?: string;\n /\n If true, the Popover will be visibly hidden when its target leaves the viewport.\n * @default false\n /\n hideOnTargetHidden?: boolean;\n /* The content of the Popover. /\n children: ReactNode;\n /* The ref of the wrapping element. */\n ref?: Ref<HTMLDivElement>;\n}\n\nconst delays = {\n none: 0,\n short: 500,\n long: 1000\n};\n\nconst Popover: <Modifiers extends string = string>(\n props: PopoverProps<Modifiers> & ForwardProps\n) => ReactElement \| null = forwardRef(\n (\n {\n show = true,\n portal = false,\n target,\n placement,\n strategy = 'fixed',\n style,\n modifiers = [],\n arrow = false,\n groupId,\n showDelay = 'none',\n hideDelay = 'none',\n hideOnTargetHidden = false,\n children,\n ...restProps\n }: PropsWithoutRef<PopoverProps> & { style?: CSSProperties },\n ref: PopoverProps['ref']\n ) => {\n const { portalTarget } = useConfiguration();\n const { checkActive, setActive } = useContext(PopoverManagerContext);\n const [, setPopperEl] = useElement<HTMLDivElement>();\n const popperRef = useConsolidatedRef<HTMLDivElement>(ref, setPopperEl);\n const arrowRef = useRef<HTMLDivElement>(null);\n const forceUpdateRef = useRef<() => void>();\n const [showPopover, setShowPopover] = useState(show);\n const timeout = useRef<number>();\n const uid = useUID();\n\n const memoedModifiers = useMemo(\n () => [\n {\n name: 'offset',\n options: {\n offset: [0, arrow ? 5.5 : 2]\n }\n },\n { name: 'hide', enabled: hideOnTargetHidden },\n { name: 'arrow', enabled: arrow, options: { element: arrowRef.current } },\n ...modifiers\n ],\n [modifiers, arrow, hideOnTargetHidden]\n );\n\n const offset = useMemo(() => {\n const offsetModifier = [...memoedModifiers]\n .reverse()\n .find(m => m.name === 'offset' && m.enabled !== false) as OffsetModifier \| undefined;\n return Array.isArray(offsetModifier?.options?.offset)\n ? offsetModifier?.options?.offset[1] ?? 0\n : 0;\n }, [memoedModifiers]);\n\n const { styles, attributes, forceUpdate } = usePopper(target, popperRef.current, {\n placement,\n strategy,\n modifiers: memoedModifiers\n });\n\n if (forceUpdate) forceUpdateRef.current = forceUpdate;\n\n useEffect(() => {\n const observer = new ResizeObserver(() => {\n forceUpdateRef.current?.();\n });\n\n if (popperRef.current) observer.observe(popperRef.current);\n if (target instanceof Element) observer.observe(target);\n\n return () => {\n observer.disconnect();\n };\n }, [forceUpdate, popperRef.current, target]);\n\n useEffect(() => {\n if (groupId && show) setActive(uid, groupId);\n\n if (windowIsAvailable) {\n if (timeout.current) clearTimeout(timeout.current);\n timeout.current = window.setTimeout(() => {\n setShowPopover(show);\n }, delays[show ? showDelay : hideDelay]);\n } else {\n setShowPopover(show);\n }\n }, [show]);\n\n useEffect(() => {\n return () => clearTimeout(timeout.current);\n }, []);\n\n const content = (\n <StyledPopover\n {...restProps}\n offset={offset}\n ref={popperRef}\n style={{ ...style, ...styles.popper }}\n {...attributes.popper}\n >\n {arrow && <StyledPopoverArrow ref={arrowRef} style={{ ...styles.arrow }} />}\n {children}\n </StyledPopover>\n );\n\n if (!target \|\| !showPopover \|\| (groupId && !checkActive(uid, groupId))) return null;\n\n return portal && portalTarget ? createPortal(content, portalTarget) : content;\n }\n);\n\nexport default Popover;\n"]}
1	+ {"version":3,"file":"Popover.js","sourceRoot":"","sources":["../../../src/components/Popover/Popover.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n useContext,\n PropsWithoutRef,\n Ref,\n CSSProperties,\n ReactElement,\n useRef,\n ReactNode,\n useEffect,\n useMemo,\n useState\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { usePopper, PopperProps } from 'react-popper';\nimport { VirtualElement } from '@popperjs/core';\nimport { OffsetModifier } from '@popperjs/core/lib/modifiers/offset';\n\nimport { BaseProps, ForwardProps } from '../../types';\nimport { useConfiguration, useConsolidatedRef, useElement, useUID } from '../../hooks';\nimport { windowIsAvailable } from '../../utils';\n\nimport { PopoverManagerContext } from './PopoverContext';\nimport { StyledPopover, StyledPopoverArrow } from './Popover.styles';\n\nexport type Delay = 'none' \| 'short' \| 'long';\nexport interface PopoverProps<Modifiers extends string = string> extends BaseProps {\n /** The DOM element or [virtual element](https://popper.js.org/docs/v2/virtual-elements) that the Popover is positioned in reference to. /\n target: Element \| VirtualElement \| null;\n /\n If true, the Popover will be visible.\n * @default true\n /\n show?: boolean;\n /\n If true, the Popover will render outside of the current DOM hierarchy in a [portal](https://reactjs.org/docs/portals.html).\n * @default false\n /\n portal?: boolean;\n /\n Delay on showing the Popover.\n * @default \"none\"\n /\n showDelay?: Delay;\n /\n Delay on hiding the Popover.\n * @default \"none\"\n /\n hideDelay?: Delay;\n /\n [React Popper Placement](https://popper.js.org/react-popper/v2/render-props/#placement)\n /\n placement?: PopperProps<Modifiers>['placement'];\n /\n [React Popper Strategy](https://popper.js.org/react-popper/v2/render-props/#strategy)\n * @default \"absolute\"\n /\n strategy?: PopperProps<Modifiers>['strategy'];\n /\n [React Popper Modifiers](https://popper.js.org/react-popper/v2/render-props/#modifiers)\n * @default []\n /\n modifiers?: PopperProps<Modifiers>['modifiers'];\n /\n If true, an arrow will visually identify from which element the Popover is rendered.\n * @default false\n /\n arrow?: boolean;\n /* The group that the Popover belongs to. Popovers in the same group will be closed when others open. /\n groupId?: string;\n /\n If true, the Popover will be visibly hidden when its target leaves the viewport.\n * @default false\n /\n hideOnTargetHidden?: boolean;\n /* The content of the Popover. /\n children: ReactNode;\n /* The ref of the wrapping element. */\n ref?: Ref<HTMLDivElement>;\n}\n\nconst delays = {\n none: 0,\n short: 500,\n long: 1000\n};\n\nconst Popover: <Modifiers extends string = string>(\n props: PopoverProps<Modifiers> & ForwardProps\n) => ReactElement \| null = forwardRef(\n (\n {\n show = true,\n portal = false,\n target,\n placement,\n strategy = 'fixed',\n style,\n modifiers = [],\n arrow = false,\n groupId,\n showDelay = 'none',\n hideDelay = 'none',\n hideOnTargetHidden = false,\n children,\n ...restProps\n }: PropsWithoutRef<PopoverProps> & { style?: CSSProperties },\n ref: PopoverProps['ref']\n ) => {\n const { portalTarget } = useConfiguration();\n const { checkActive, setActive } = useContext(PopoverManagerContext);\n const [, setPopperEl] = useElement<HTMLDivElement>();\n const popperRef = useConsolidatedRef<HTMLDivElement>(ref, setPopperEl);\n const arrowRef = useRef<HTMLDivElement>(null);\n const forceUpdateRef = useRef<() => void>();\n const [showPopover, setShowPopover] = useState(show);\n const timeout = useRef<number>();\n const uid = useUID();\n\n const memoedModifiers = useMemo(\n () => [\n {\n name: 'offset',\n options: {\n offset: [0, arrow ? 5.5 : 2]\n }\n },\n { name: 'hide', enabled: hideOnTargetHidden },\n { name: 'arrow', enabled: arrow, options: { element: arrowRef.current } },\n ...modifiers\n ],\n [modifiers, arrow, hideOnTargetHidden]\n );\n\n const offset = useMemo(() => {\n const offsetModifier = [...memoedModifiers]\n .reverse()\n .find(m => m.name === 'offset' && m.enabled !== false) as OffsetModifier \| undefined;\n return Array.isArray(offsetModifier?.options?.offset)\n ? offsetModifier?.options?.offset[1] ?? 0\n : 0;\n }, [memoedModifiers]);\n\n const { styles, attributes, forceUpdate } = usePopper(target, popperRef.current, {\n placement,\n strategy,\n modifiers: memoedModifiers\n });\n\n if (forceUpdate) forceUpdateRef.current = forceUpdate;\n\n useEffect(() => {\n const observer = new ResizeObserver(() => {\n forceUpdateRef.current?.();\n });\n\n if (popperRef.current) observer.observe(popperRef.current);\n if (target instanceof Element) observer.observe(target);\n\n return () => {\n observer.disconnect();\n };\n }, [forceUpdate, popperRef.current, target]);\n\n useEffect(() => {\n if (groupId && show) setActive(uid, groupId);\n\n if (windowIsAvailable) {\n if (timeout.current) clearTimeout(timeout.current);\n timeout.current = window.setTimeout(() => {\n setShowPopover(show);\n }, delays[show ? showDelay : hideDelay]);\n } else {\n setShowPopover(show);\n }\n }, [show]);\n\n useEffect(() => {\n return () => clearTimeout(timeout.current);\n }, []);\n\n const content = (\n <StyledPopover\n {...restProps}\n offset={offset}\n ref={popperRef}\n style={{ ...style, ...styles.popper }}\n {...attributes.popper}\n >\n {arrow && <StyledPopoverArrow ref={arrowRef} style={{ ...styles.arrow }} />}\n {children}\n </StyledPopover>\n );\n\n if (!target \|\| !showPopover \|\| (groupId && !checkActive(uid, groupId))) return null;\n\n return portal && portalTarget ? createPortal(content, portalTarget) : content;\n }\n);\n\nexport default Popover;\n"]}

package/lib/components/Popover/PopoverManager.js CHANGED Viewed

@@ -11,10 +11,10 @@ const PopoverManager = ({ children }) => {
             return { ...curr, [groupId]: id };
         });
     };
-    return (_jsx(PopoverManagerContext.Provider, Object.assign({ value: {
+    return (_jsx(PopoverManagerContext.Provider, { value: {
             checkActive,
             setActive
-        } }, { children: children }), void 0));
+        }, children: children }, void 0));
 };
 export default PopoverManager;
 //# sourceMappingURL=PopoverManager.js.map

package/lib/components/Popover/PopoverManager.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PopoverManager.js","sourceRoot":"","sources":["../../../src/components/Popover/PopoverManager.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAgC,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE/D,OAAO,EAAE,qBAAqB,EAAE,MAAM,kBAAkB,CAAC;AAEzD,MAAM,cAAc,GAA+C,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;IAClF,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAyB,EAAE,CAAC,CAAC;IAErE,MAAM,WAAW,GAAG,CAAC,EAAU,EAAE,OAAe,EAAW,EAAE;QAC3D,OAAO,QAAQ,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;IAClC,CAAC,CAAC;IAEF,MAAM,SAAS,GAAG,CAAC,EAAU,EAAE,OAAe,EAAE,EAAE;QAChD,WAAW,CAAC,IAAI,CAAC,EAAE;YACjB,OAAO,EAAE,GAAG,IAAI,EAAE,CAAC,OAAO,CAAC,EAAE,EAAE,EAAE,CAAC;QACpC,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,qBAAqB,CAAC,QAAQ,~~kBAC7B~~,KAAK,EAAE;YACL,WAAW;YACX,SAAS;SACV,~~gBAEA~~,QAAQ,~~YACsB~~,CAClC,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["import { FunctionComponent, ReactNode, useState } from 'react';\n\nimport { PopoverManagerContext } from './PopoverContext';\n\nconst PopoverManager: FunctionComponent<{ children: ReactNode }> = ({ children }) => {\n const [popovers, setPopovers] = useState<Record<string, string>>({});\n\n const checkActive = (id: string, groupId: string): boolean => {\n return popovers[groupId] === id;\n };\n\n const setActive = (id: string, groupId: string) => {\n setPopovers(curr => {\n return { ...curr, [groupId]: id };\n });\n };\n\n return (\n <PopoverManagerContext.Provider\n value={{\n checkActive,\n setActive\n }}\n >\n {children}\n </PopoverManagerContext.Provider>\n );\n};\n\nexport default PopoverManager;\n"]}
1	+ {"version":3,"file":"PopoverManager.js","sourceRoot":"","sources":["../../../src/components/Popover/PopoverManager.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAgC,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE/D,OAAO,EAAE,qBAAqB,EAAE,MAAM,kBAAkB,CAAC;AAEzD,MAAM,cAAc,GAA+C,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;IAClF,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAyB,EAAE,CAAC,CAAC;IAErE,MAAM,WAAW,GAAG,CAAC,EAAU,EAAE,OAAe,EAAW,EAAE;QAC3D,OAAO,QAAQ,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;IAClC,CAAC,CAAC;IAEF,MAAM,SAAS,GAAG,CAAC,EAAU,EAAE,OAAe,EAAE,EAAE;QAChD,WAAW,CAAC,IAAI,CAAC,EAAE;YACjB,OAAO,EAAE,GAAG,IAAI,EAAE,CAAC,OAAO,CAAC,EAAE,EAAE,EAAE,CAAC;QACpC,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,qBAAqB,CAAC,QAAQ,IAC7B,KAAK,EAAE;YACL,WAAW;YACX,SAAS;SACV,YAEA,QAAQ,WACsB,CAClC,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["import { FunctionComponent, ReactNode, useState } from 'react';\n\nimport { PopoverManagerContext } from './PopoverContext';\n\nconst PopoverManager: FunctionComponent<{ children: ReactNode }> = ({ children }) => {\n const [popovers, setPopovers] = useState<Record<string, string>>({});\n\n const checkActive = (id: string, groupId: string): boolean => {\n return popovers[groupId] === id;\n };\n\n const setActive = (id: string, groupId: string) => {\n setPopovers(curr => {\n return { ...curr, [groupId]: id };\n });\n };\n\n return (\n <PopoverManagerContext.Provider\n value={{\n checkActive,\n setActive\n }}\n >\n {children}\n </PopoverManagerContext.Provider>\n );\n};\n\nexport default PopoverManager;\n"]}

package/lib/components/Progress/Bar.js CHANGED Viewed

@@ -64,7 +64,7 @@ const Bar = forwardRef(({ value, minValue = 0, maxValue = 100, message, placemen
         else
             percentage = (1 - (value - minValue) / (maxValue - minValue)) * -100;
     }
-    return (_jsx(StyledProgressBar, Object.assign({ ref: ref, role: 'progressbar', "aria-valuemin": minValue, "aria-valuemax": maxValue, "aria-valuenow": value, placement: placement, determinate: typeof value === 'number', style: { ...style, '--progress': percentage ? `${percentage}%` : '' } }, restProps), void 0));
+    return (_jsx(StyledProgressBar, { ref: ref, role: 'progressbar', "aria-valuemin": minValue, "aria-valuemax": maxValue, "aria-valuenow": value, placement: placement, determinate: typeof value === 'number', style: { ...style, '--progress': percentage ? `${percentage}%` : '' }, ...restProps }, void 0));
 });
 export default Bar;
 //# sourceMappingURL=Bar.js.map

package/lib/components/Progress/Bar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Bar.js","sourceRoot":"","sources":["../../../src/components/Progress/Bar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAM,UAAU,EAAkC,MAAM,OAAO,CAAC;AACvE,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAK/C,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CACzC,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,EAAE,EAAE;IACpC,OAAO,GAAG,CAAA;;0BAEY,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,aAAa,CAAC;uBACxC,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC;;;;;;;;;;;;;;;;;;;;yBAoBzB,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC;4BACxB,KAAK,CAAC,UAAU,CAAC,QAAQ,CAAC,gBAAgB,CAAC;UAC7D,WAAW;QACb,GAAG,CAAA;;;6CAGkC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK;cACzD,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI;SACrC;;UAEC,CAAC,WAAW;QACd,GAAG,CAAA;2CACgC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK;;SAE5D;;;QAGD,SAAS,KAAK,QAAQ;QACtB,CAAC,CAAC,GAAG,CAAA;;;WAGF;QACH,CAAC,CAAC,GAAG,CAAA;;WAEF;KACN,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,iBAAiB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAElD,MAAM,GAAG,GAAqC,UAAU,CACtD,CACE,EACE,KAAK,EACL,QAAQ,GAAG,CAAC,EACZ,QAAQ,GAAG,GAAG,EACd,OAAO,EACP,SAAS,EACT,KAAK,EACL,GAAG,SAAS,EAC+C,EAC7D,GAAyB,EACzB,EAAE;IACF,IAAI,UAAU,GAAG,KAAK,CAAC;IAEvB,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;QAC7B,IAAI,KAAK,GAAG,QAAQ,IAAI,QAAQ,GAAG,QAAQ;YAAE,UAAU,GAAG,CAAC,CAAC;aACvD,IAAI,KAAK,GAAG,QAAQ;YAAE,UAAU,GAAG,GAAG,CAAC;;YACvC,UAAU,GAAG,CAAC,CAAC,GAAG,CAAC,KAAK,GAAG,QAAQ,CAAC,GAAG,CAAC,QAAQ,GAAG,QAAQ,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC;KAC3E;IAED,OAAO,CACL,KAAC,iBAAiB,~~kBAChB~~,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,aAAa,mBACH,QAAQ,mBACR,QAAQ,mBACR,KAAK,EACpB,SAAS,EAAE,SAAS,EACpB,WAAW,EAAE,OAAO,KAAK,KAAK,QAAQ,EACtC,KAAK,EAAE,EAAE,GAAG,KAAK,EAAE,YAAY,EAAE,UAAU,CAAC,CAAC,CAAC,GAAG,UAAU,GAAG,CAAC,CAAC,CAAC,EAAE,EAAmB,~~IAClF~~,SAAS,~~UACb~~,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,GAAG,CAAC","sourcesContent":["import { FC, forwardRef, PropsWithoutRef, CSSProperties } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport { ForwardProps } from '../../types';\n\nimport { ProgressProps } from './Progress.types';\n\nexport const StyledProgressBar = styled.div<ProgressProps & { determinate: boolean }>(\n ({ theme, placement, determinate }) => {\n return css`\n height: 0.375rem;\n background-color: ${theme.base.colors.gray['extra-light']};\n border-radius: ${theme.base['border-radius']};\n min-width: 2rem;\n overflow: hidden;\n\n @keyframes LoadingBar {\n 0% {\n transform: translateX(-100%);\n }\n\n 100% {\n transform: translateX(200%);\n }\n }\n\n ::before {\n content: '';\n display: block;\n height: 100%;\n width: 100%;\n left: 0;\n border-radius: ${theme.base['border-radius']};\n background-color: ${theme.components.progress['progress-color']};\n ${determinate &&\n css`\n transform: translateX(var(--progress, 0));\n transform-origin: 0 50%;\n transition: transform calc(0.5 * ${theme.base.animation.speed})\n ${theme.base.animation.timing.ease};\n `}\n\n ${!determinate &&\n css`\n animation: LoadingBar calc(8 * ${theme.base.animation.speed}) linear infinite;\n width: 50%;\n `}\n }\n\n ${placement === 'inline'\n ? css`\n display: inline-block;\n position: relative;\n `\n : css`\n width: 50%;\n `}\n `;\n }\n);\n\nStyledProgressBar.defaultProps = defaultThemeProp;\n\nconst Bar: FC<ProgressProps & ForwardProps> = forwardRef(\n (\n {\n value,\n minValue = 0,\n maxValue = 100,\n message,\n placement,\n style,\n ...restProps\n }: PropsWithoutRef<ProgressProps & { style?: CSSProperties }>,\n ref: ProgressProps['ref']\n ) => {\n let percentage = value;\n\n if (typeof value === 'number') {\n if (value > maxValue \|\| minValue > maxValue) percentage = 0;\n else if (value < minValue) percentage = 100;\n else percentage = (1 - (value - minValue) / (maxValue - minValue)) * -100;\n }\n\n return (\n <StyledProgressBar\n ref={ref}\n role='progressbar'\n aria-valuemin={minValue}\n aria-valuemax={maxValue}\n aria-valuenow={value}\n placement={placement}\n determinate={typeof value === 'number'}\n style={{ ...style, '--progress': percentage ? `${percentage}%` : '' } as CSSProperties}\n {...restProps}\n />\n );\n }\n);\n\nexport default Bar;\n"]}
1	+ {"version":3,"file":"Bar.js","sourceRoot":"","sources":["../../../src/components/Progress/Bar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAM,UAAU,EAAkC,MAAM,OAAO,CAAC;AACvE,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAK/C,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CACzC,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,EAAE,EAAE;IACpC,OAAO,GAAG,CAAA;;0BAEY,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,aAAa,CAAC;uBACxC,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC;;;;;;;;;;;;;;;;;;;;yBAoBzB,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC;4BACxB,KAAK,CAAC,UAAU,CAAC,QAAQ,CAAC,gBAAgB,CAAC;UAC7D,WAAW;QACb,GAAG,CAAA;;;6CAGkC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK;cACzD,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI;SACrC;;UAEC,CAAC,WAAW;QACd,GAAG,CAAA;2CACgC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK;;SAE5D;;;QAGD,SAAS,KAAK,QAAQ;QACtB,CAAC,CAAC,GAAG,CAAA;;;WAGF;QACH,CAAC,CAAC,GAAG,CAAA;;WAEF;KACN,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,iBAAiB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAElD,MAAM,GAAG,GAAqC,UAAU,CACtD,CACE,EACE,KAAK,EACL,QAAQ,GAAG,CAAC,EACZ,QAAQ,GAAG,GAAG,EACd,OAAO,EACP,SAAS,EACT,KAAK,EACL,GAAG,SAAS,EAC+C,EAC7D,GAAyB,EACzB,EAAE;IACF,IAAI,UAAU,GAAG,KAAK,CAAC;IAEvB,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;QAC7B,IAAI,KAAK,GAAG,QAAQ,IAAI,QAAQ,GAAG,QAAQ;YAAE,UAAU,GAAG,CAAC,CAAC;aACvD,IAAI,KAAK,GAAG,QAAQ;YAAE,UAAU,GAAG,GAAG,CAAC;;YACvC,UAAU,GAAG,CAAC,CAAC,GAAG,CAAC,KAAK,GAAG,QAAQ,CAAC,GAAG,CAAC,QAAQ,GAAG,QAAQ,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC;KAC3E;IAED,OAAO,CACL,KAAC,iBAAiB,IAChB,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,aAAa,mBACH,QAAQ,mBACR,QAAQ,mBACR,KAAK,EACpB,SAAS,EAAE,SAAS,EACpB,WAAW,EAAE,OAAO,KAAK,KAAK,QAAQ,EACtC,KAAK,EAAE,EAAE,GAAG,KAAK,EAAE,YAAY,EAAE,UAAU,CAAC,CAAC,CAAC,GAAG,UAAU,GAAG,CAAC,CAAC,CAAC,EAAE,EAAmB,KAClF,SAAS,WACb,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,GAAG,CAAC","sourcesContent":["import { FC, forwardRef, PropsWithoutRef, CSSProperties } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport { ForwardProps } from '../../types';\n\nimport { ProgressProps } from './Progress.types';\n\nexport const StyledProgressBar = styled.div<ProgressProps & { determinate: boolean }>(\n ({ theme, placement, determinate }) => {\n return css`\n height: 0.375rem;\n background-color: ${theme.base.colors.gray['extra-light']};\n border-radius: ${theme.base['border-radius']};\n min-width: 2rem;\n overflow: hidden;\n\n @keyframes LoadingBar {\n 0% {\n transform: translateX(-100%);\n }\n\n 100% {\n transform: translateX(200%);\n }\n }\n\n ::before {\n content: '';\n display: block;\n height: 100%;\n width: 100%;\n left: 0;\n border-radius: ${theme.base['border-radius']};\n background-color: ${theme.components.progress['progress-color']};\n ${determinate &&\n css`\n transform: translateX(var(--progress, 0));\n transform-origin: 0 50%;\n transition: transform calc(0.5 * ${theme.base.animation.speed})\n ${theme.base.animation.timing.ease};\n `}\n\n ${!determinate &&\n css`\n animation: LoadingBar calc(8 * ${theme.base.animation.speed}) linear infinite;\n width: 50%;\n `}\n }\n\n ${placement === 'inline'\n ? css`\n display: inline-block;\n position: relative;\n `\n : css`\n width: 50%;\n `}\n `;\n }\n);\n\nStyledProgressBar.defaultProps = defaultThemeProp;\n\nconst Bar: FC<ProgressProps & ForwardProps> = forwardRef(\n (\n {\n value,\n minValue = 0,\n maxValue = 100,\n message,\n placement,\n style,\n ...restProps\n }: PropsWithoutRef<ProgressProps & { style?: CSSProperties }>,\n ref: ProgressProps['ref']\n ) => {\n let percentage = value;\n\n if (typeof value === 'number') {\n if (value > maxValue \|\| minValue > maxValue) percentage = 0;\n else if (value < minValue) percentage = 100;\n else percentage = (1 - (value - minValue) / (maxValue - minValue)) * -100;\n }\n\n return (\n <StyledProgressBar\n ref={ref}\n role='progressbar'\n aria-valuemin={minValue}\n aria-valuemax={maxValue}\n aria-valuenow={value}\n placement={placement}\n determinate={typeof value === 'number'}\n style={{ ...style, '--progress': percentage ? `${percentage}%` : '' } as CSSProperties}\n {...restProps}\n />\n );\n }\n);\n\nexport default Bar;\n"]}

package/lib/components/Progress/Ellipsis.js CHANGED Viewed

@@ -73,7 +73,7 @@ export const StyledProgressEllipsis = styled.div(({ theme, placement }) => {
 });
 StyledProgressEllipsis.defaultProps = defaultThemeProp;
 const Ellipsis = forwardRef(({ message, placement, ...restProps }, ref) => {
-    return (_jsx(StyledProgressEllipsis, Object.assign({ ref: ref, role: 'progressbar', placement: placement }, restProps, { children: _jsxs("span", { children: [_jsx("span", {}, void 0), _jsx("span", {}, void 0), _jsx("span", {}, void 0)] }, void 0) }), void 0));
+    return (_jsx(StyledProgressEllipsis, { ref: ref, role: 'progressbar', placement: placement, ...restProps, children: _jsxs("span", { children: [_jsx("span", {}, void 0), _jsx("span", {}, void 0), _jsx("span", {}, void 0)] }, void 0) }, void 0));
 });
 export default Ellipsis;
 //# sourceMappingURL=Ellipsis.js.map

package/lib/components/Progress/Ellipsis.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Ellipsis.js","sourceRoot":"","sources":["../../../src/components/Progress/Ellipsis.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAM,UAAU,EAAmB,MAAM,OAAO,CAAC;AACxD,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAK/C,MAAM,CAAC,MAAM,sBAAsB,GAAG,MAAM,CAAC,GAAG,CAAgB,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE;IACvF,OAAO,GAAG,CAAA;;eAEG,SAAS,KAAK,QAAQ,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,OAAO;;;;;;;;;;;;;;;;;;;;;;;QAuBvD,SAAS,KAAK,QAAQ;QACxB,GAAG,CAAA;;;OAGF;;;;;oBAKa,KAAK,CAAC,UAAU,CAAC,QAAQ,CAAC,gBAAgB,CAAC;;4CAEnB,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK;;QAE9D,SAAS,KAAK,QAAQ;QACxB,GAAG,CAAA;;;OAGF;;QAEC,SAAS,KAAK,OAAO;QACvB,GAAG,CAAA;;;OAGF;;QAEC,SAAS,KAAK,QAAQ;QACxB,GAAG,CAAA;;;;uCAI8B,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK;OAC1D;;;;;;;2BAOoB,MAAM,GAAG,CAAC;;;GAGlC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,sBAAsB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEvD,MAAM,QAAQ,GAAqC,UAAU,CAC3D,CACE,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,SAAS,EAAkC,EACpE,GAAyB,EACzB,EAAE;IACF,OAAO,CACL,KAAC,sBAAsB,~~kBAAC~~,GAAG,EAAE,GAAG,EAAE,IAAI,EAAC,aAAa,EAAC,SAAS,EAAE,SAAS,~~IAAM~~,SAAS,~~cACtF~~,2BACE,wBAAQ,EACR,wBAAQ,EACR,wBAAQ,YACH,~~YACgB~~,CAC1B,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,QAAQ,CAAC","sourcesContent":["import { FC, forwardRef, PropsWithoutRef } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport { ForwardProps } from '../../types';\n\nimport { ProgressProps } from './Progress.types';\n\nexport const StyledProgressEllipsis = styled.div<ProgressProps>(({ theme, placement }) => {\n return css`\n line-height: 1;\n display: ${placement === 'inline' ? 'inline-flex' : 'block'};\n\n @keyframes LoadingEllipsis {\n 0% {\n transform: scale(0);\n opacity: 0;\n }\n\n 50% {\n transform: scale(1);\n opacity: 1;\n }\n\n 100% {\n transform: scale(0);\n opacity: 0;\n }\n }\n\n > span {\n display: flex;\n mix-blend-mode: multiply;\n\n ${placement === 'inline' &&\n css`\n display: inline-flex;\n margin-left: 0.1875rem;\n `}\n }\n\n > span span {\n margin: 0 0.3125rem;\n background: ${theme.components.progress['progress-color']};\n border-radius: 50%;\n animation: LoadingEllipsis calc(4 * ${theme.base.animation.speed}) infinite;\n\n ${placement === 'global' &&\n css`\n width: 1.25rem;\n height: 1.25rem;\n `}\n\n ${placement === 'local' &&\n css`\n width: 0.625rem;\n height: 0.625rem;\n `}\n\n ${placement === 'inline' &&\n css`\n width: 0.1875rem;\n height: 0.1875rem;\n margin: 0 0.1875rem;\n animation-duration: calc(4 * ${theme.base.animation.speed});\n `}\n\n &:nth-child(2) {\n animation-delay: 0.1667s;\n }\n\n &:nth-child(3) {\n animation-delay: ${0.1667 * 2}s;\n }\n }\n `;\n});\n\nStyledProgressEllipsis.defaultProps = defaultThemeProp;\n\nconst Ellipsis: FC<ProgressProps & ForwardProps> = forwardRef(\n (\n { message, placement, ...restProps }: PropsWithoutRef<ProgressProps>,\n ref: ProgressProps['ref']\n ) => {\n return (\n <StyledProgressEllipsis ref={ref} role='progressbar' placement={placement} {...restProps}>\n <span>\n <span />\n <span />\n <span />\n </span>\n </StyledProgressEllipsis>\n );\n }\n);\n\nexport default Ellipsis;\n"]}
1	+ {"version":3,"file":"Ellipsis.js","sourceRoot":"","sources":["../../../src/components/Progress/Ellipsis.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAM,UAAU,EAAmB,MAAM,OAAO,CAAC;AACxD,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAK/C,MAAM,CAAC,MAAM,sBAAsB,GAAG,MAAM,CAAC,GAAG,CAAgB,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE;IACvF,OAAO,GAAG,CAAA;;eAEG,SAAS,KAAK,QAAQ,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,OAAO;;;;;;;;;;;;;;;;;;;;;;;QAuBvD,SAAS,KAAK,QAAQ;QACxB,GAAG,CAAA;;;OAGF;;;;;oBAKa,KAAK,CAAC,UAAU,CAAC,QAAQ,CAAC,gBAAgB,CAAC;;4CAEnB,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK;;QAE9D,SAAS,KAAK,QAAQ;QACxB,GAAG,CAAA;;;OAGF;;QAEC,SAAS,KAAK,OAAO;QACvB,GAAG,CAAA;;;OAGF;;QAEC,SAAS,KAAK,QAAQ;QACxB,GAAG,CAAA;;;;uCAI8B,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK;OAC1D;;;;;;;2BAOoB,MAAM,GAAG,CAAC;;;GAGlC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,sBAAsB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEvD,MAAM,QAAQ,GAAqC,UAAU,CAC3D,CACE,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,SAAS,EAAkC,EACpE,GAAyB,EACzB,EAAE;IACF,OAAO,CACL,KAAC,sBAAsB,IAAC,GAAG,EAAE,GAAG,EAAE,IAAI,EAAC,aAAa,EAAC,SAAS,EAAE,SAAS,KAAM,SAAS,YACtF,2BACE,wBAAQ,EACR,wBAAQ,EACR,wBAAQ,YACH,WACgB,CAC1B,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,QAAQ,CAAC","sourcesContent":["import { FC, forwardRef, PropsWithoutRef } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport { ForwardProps } from '../../types';\n\nimport { ProgressProps } from './Progress.types';\n\nexport const StyledProgressEllipsis = styled.div<ProgressProps>(({ theme, placement }) => {\n return css`\n line-height: 1;\n display: ${placement === 'inline' ? 'inline-flex' : 'block'};\n\n @keyframes LoadingEllipsis {\n 0% {\n transform: scale(0);\n opacity: 0;\n }\n\n 50% {\n transform: scale(1);\n opacity: 1;\n }\n\n 100% {\n transform: scale(0);\n opacity: 0;\n }\n }\n\n > span {\n display: flex;\n mix-blend-mode: multiply;\n\n ${placement === 'inline' &&\n css`\n display: inline-flex;\n margin-left: 0.1875rem;\n `}\n }\n\n > span span {\n margin: 0 0.3125rem;\n background: ${theme.components.progress['progress-color']};\n border-radius: 50%;\n animation: LoadingEllipsis calc(4 * ${theme.base.animation.speed}) infinite;\n\n ${placement === 'global' &&\n css`\n width: 1.25rem;\n height: 1.25rem;\n `}\n\n ${placement === 'local' &&\n css`\n width: 0.625rem;\n height: 0.625rem;\n `}\n\n ${placement === 'inline' &&\n css`\n width: 0.1875rem;\n height: 0.1875rem;\n margin: 0 0.1875rem;\n animation-duration: calc(4 * ${theme.base.animation.speed});\n `}\n\n &:nth-child(2) {\n animation-delay: 0.1667s;\n }\n\n &:nth-child(3) {\n animation-delay: ${0.1667 * 2}s;\n }\n }\n `;\n});\n\nStyledProgressEllipsis.defaultProps = defaultThemeProp;\n\nconst Ellipsis: FC<ProgressProps & ForwardProps> = forwardRef(\n (\n { message, placement, ...restProps }: PropsWithoutRef<ProgressProps>,\n ref: ProgressProps['ref']\n ) => {\n return (\n <StyledProgressEllipsis ref={ref} role='progressbar' placement={placement} {...restProps}>\n <span>\n <span />\n <span />\n <span />\n </span>\n </StyledProgressEllipsis>\n );\n }\n);\n\nexport default Ellipsis;\n"]}

package/lib/components/Progress/Progress.js CHANGED Viewed

@@ -73,8 +73,8 @@ const Progress = forwardRef(({ variant = 'ring', placement = 'global', visible =
     }, []);
     if (isNull)
         return null;
-    const comp = (_jsx(Comp, Object.assign({}, restProps, { placement: placement, value: value, "aria-valuetext": message && typeof value === 'number' ? `${message} - ${value}` : message, ref: ref }), void 0));
-    const content = placement === 'inline' ? (comp) : (_jsxs(Backdrop, Object.assign({ open: isVisible, container: { direction: 'column' }, position: placement === 'global' ? 'fixed' : 'absolute', variant: 'light', alpha: 0.5, onAfterTransitionIn: onTransitionEndIn, onAfterTransitionOut: onBackdropTransitionEnd }, { children: [comp, !!message && (_jsx(Text, Object.assign({ as: StyledMessage, variant: 'secondary', "aria-hidden": 'true' }, { children: message }), void 0))] }), void 0));
+    const comp = (_jsx(Comp, { ...restProps, placement: placement, value: value, "aria-valuetext": message && typeof value === 'number' ? `${message} - ${value}` : message, ref: ref }, void 0));
+    const content = placement === 'inline' ? (comp) : (_jsxs(Backdrop, { open: isVisible, container: { direction: 'column' }, position: placement === 'global' ? 'fixed' : 'absolute', variant: 'light', alpha: 0.5, onAfterTransitionIn: onTransitionEndIn, onAfterTransitionOut: onBackdropTransitionEnd, children: [comp, !!message && (_jsx(Text, { as: StyledMessage, variant: 'secondary', "aria-hidden": 'true', children: message }, void 0))] }, void 0));
     return placement === 'global' && portalTarget ? createPortal(content, portalTarget) : content;
 });
 export default Progress;

package/lib/components/Progress/Progress.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Progress.js","sourceRoot":"","sources":["../../../src/components/Progress/Progress.tsx"],"names":[],"mappings":"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~~oBACC~~,SAAS,~~IACb~~,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,oBACI,OAAO,IAAI,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,GAAG,OAAO,MAAM,KAAK,EAAE,CAAC,CAAC,CAAC,OAAO,EACxF,GAAG,EAAE,GAAG,~~YACR~~,CACH,CAAC;IAEF,MAAM,OAAO,GACX,SAAS,KAAK,QAAQ,CAAC,CAAC,CAAC,CACvB,IAAI,CACL,CAAC,CAAC,CAAC,CACF,MAAC,QAAQ,~~kBACP~~,IAAI,EAAE,SAAS,EACf,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,EAClC,QAAQ,EAAE,SAAS,KAAK,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,EACvD,OAAO,EAAC,OAAO,EACf,KAAK,EAAE,GAAG,EACV,mBAAmB,EAAE,iBAAiB,EACtC,oBAAoB,EAAE,uBAAuB,~~iBAE5C~~,IAAI,EACJ,CAAC,CAAC,OAAO,IAAI,CACZ,KAAC,IAAI,~~kBAAC~~,EAAE,EAAE,aAAa,EAAE,OAAO,EAAC,WAAW,iBAAa,MAAM,~~gBAC5D~~,OAAO,~~YACH~~,CACR,~~aACQ~~,CACZ,CAAC;IAEJ,OAAO,SAAS,KAAK,QAAQ,IAAI,YAAY,CAAC,CAAC,CAAC,YAAY,CAAC,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC;AAChG,CAAC,CACF,CAAC;AAEF,eAAe,QAAQ,CAAC","sourcesContent":["import { forwardRef, PropsWithoutRef, FC, useState, useEffect, useRef } from 'react';\nimport { createPortal } from 'react-dom';\nimport styled, { css } from 'styled-components';\nimport { readableColor, rgba } from 'polished';\n\nimport { ForwardProps } from '../../types';\nimport Backdrop from '../Backdrop';\nimport Text from '../Text';\nimport { calculateFontSize, FontSize } from '../../styles';\nimport { tryCatch } from '../../utils';\nimport { useConfiguration } from '../../hooks';\n\nimport { ProgressProps } from './Progress.types';\nimport Bar from './Bar';\nimport Ellipsis from './Ellipsis';\nimport Ring from './Ring';\n\nconst StyledMessage = styled.span(({ theme }) => {\n const color = tryCatch(() => {\n return rgba(\n readableColor(theme.base.palette['primary-background']),\n theme.base.transparency['transparent-3']\n );\n });\n\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n return css`\n margin-top: 0.5rem;\n font-size: ${fontSize[theme.components.label['font-size'] as FontSize]};\n font-weight: ${theme.base['font-weight']['semi-bold']};\n color: ${color};\n `;\n});\n\nconst Progress: FC<ProgressProps & ForwardProps> = forwardRef(\n (\n {\n variant = 'ring',\n placement = 'global',\n visible = true,\n onTransitionEndIn,\n onTransitionEndOut,\n value,\n message,\n ...restProps\n }: PropsWithoutRef<ProgressProps>,\n ref: ProgressProps['ref']\n ) => {\n const [isVisible, setIsVisible] = useState(visible);\n const [isNull, setIsNull] = useState(!visible);\n const { portalTarget } = useConfiguration();\n const showTime = useRef<number>();\n const showTimeout = useRef<number>();\n const hideTimeout = useRef<number>();\n\n let Comp = Ring;\n if (variant === 'bar') Comp = Bar;\n else if (variant === 'ellipsis') Comp = Ellipsis;\n\n const onBackdropTransitionEnd = () => {\n setIsNull(true);\n onTransitionEndOut?.();\n };\n\n useEffect(() => {\n if (visible) {\n clearTimeout(hideTimeout.current);\n showTime.current = Date.now();\n showTimeout.current = window.setTimeout(() => {\n setIsVisible(true);\n setIsNull(false);\n }, 100);\n } else {\n clearTimeout(showTimeout.current);\n\n if (typeof showTime.current === 'number') {\n const minimumDuration = 1000;\n const timeElapsed = Date.now() - showTime.current;\n\n if (timeElapsed > minimumDuration) setIsVisible(false);\n else {\n hideTimeout.current = window.setTimeout(() => {\n setIsVisible(false);\n }, minimumDuration - timeElapsed);\n }\n } else setIsVisible(false);\n }\n }, [visible]);\n\n useEffect(() => {\n return () => {\n clearTimeout(showTimeout.current);\n clearTimeout(hideTimeout.current);\n };\n }, []);\n\n if (isNull) return null;\n\n const comp = (\n <Comp\n {...restProps}\n placement={placement}\n value={value}\n aria-valuetext={message && typeof value === 'number' ? `${message} - ${value}` : message}\n ref={ref}\n />\n );\n\n const content =\n placement === 'inline' ? (\n comp\n ) : (\n <Backdrop\n open={isVisible}\n container={{ direction: 'column' }}\n position={placement === 'global' ? 'fixed' : 'absolute'}\n variant='light'\n alpha={0.5}\n onAfterTransitionIn={onTransitionEndIn}\n onAfterTransitionOut={onBackdropTransitionEnd}\n >\n {comp}\n {!!message && (\n <Text as={StyledMessage} variant='secondary' aria-hidden='true'>\n {message}\n </Text>\n )}\n </Backdrop>\n );\n\n return placement === 'global' && portalTarget ? createPortal(content, portalTarget) : content;\n }\n);\n\nexport default Progress;\n"]}
1	+ {"version":3,"file":"Progress.js","sourceRoot":"","sources":["../../../src/components/Progress/Progress.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, PropsWithoutRef, FC, useState, useEffect, useRef } from 'react';\nimport { createPortal } from 'react-dom';\nimport styled, { css } from 'styled-components';\nimport { readableColor, rgba } from 'polished';\n\nimport { ForwardProps } from '../../types';\nimport Backdrop from '../Backdrop';\nimport Text from '../Text';\nimport { calculateFontSize, FontSize } from '../../styles';\nimport { tryCatch } from '../../utils';\nimport { useConfiguration } from '../../hooks';\n\nimport { ProgressProps } from './Progress.types';\nimport Bar from './Bar';\nimport Ellipsis from './Ellipsis';\nimport Ring from './Ring';\n\nconst StyledMessage = styled.span(({ theme }) => {\n const color = tryCatch(() => {\n return rgba(\n readableColor(theme.base.palette['primary-background']),\n theme.base.transparency['transparent-3']\n );\n });\n\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n return css`\n margin-top: 0.5rem;\n font-size: ${fontSize[theme.components.label['font-size'] as FontSize]};\n font-weight: ${theme.base['font-weight']['semi-bold']};\n color: ${color};\n `;\n});\n\nconst Progress: FC<ProgressProps & ForwardProps> = forwardRef(\n (\n {\n variant = 'ring',\n placement = 'global',\n visible = true,\n onTransitionEndIn,\n onTransitionEndOut,\n value,\n message,\n ...restProps\n }: PropsWithoutRef<ProgressProps>,\n ref: ProgressProps['ref']\n ) => {\n const [isVisible, setIsVisible] = useState(visible);\n const [isNull, setIsNull] = useState(!visible);\n const { portalTarget } = useConfiguration();\n const showTime = useRef<number>();\n const showTimeout = useRef<number>();\n const hideTimeout = useRef<number>();\n\n let Comp = Ring;\n if (variant === 'bar') Comp = Bar;\n else if (variant === 'ellipsis') Comp = Ellipsis;\n\n const onBackdropTransitionEnd = () => {\n setIsNull(true);\n onTransitionEndOut?.();\n };\n\n useEffect(() => {\n if (visible) {\n clearTimeout(hideTimeout.current);\n showTime.current = Date.now();\n showTimeout.current = window.setTimeout(() => {\n setIsVisible(true);\n setIsNull(false);\n }, 100);\n } else {\n clearTimeout(showTimeout.current);\n\n if (typeof showTime.current === 'number') {\n const minimumDuration = 1000;\n const timeElapsed = Date.now() - showTime.current;\n\n if (timeElapsed > minimumDuration) setIsVisible(false);\n else {\n hideTimeout.current = window.setTimeout(() => {\n setIsVisible(false);\n }, minimumDuration - timeElapsed);\n }\n } else setIsVisible(false);\n }\n }, [visible]);\n\n useEffect(() => {\n return () => {\n clearTimeout(showTimeout.current);\n clearTimeout(hideTimeout.current);\n };\n }, []);\n\n if (isNull) return null;\n\n const comp = (\n <Comp\n {...restProps}\n placement={placement}\n value={value}\n aria-valuetext={message && typeof value === 'number' ? `${message} - ${value}` : message}\n ref={ref}\n />\n );\n\n const content =\n placement === 'inline' ? (\n comp\n ) : (\n <Backdrop\n open={isVisible}\n container={{ direction: 'column' }}\n position={placement === 'global' ? 'fixed' : 'absolute'}\n variant='light'\n alpha={0.5}\n onAfterTransitionIn={onTransitionEndIn}\n onAfterTransitionOut={onBackdropTransitionEnd}\n >\n {comp}\n {!!message && (\n <Text as={StyledMessage} variant='secondary' aria-hidden='true'>\n {message}\n </Text>\n )}\n </Backdrop>\n );\n\n return placement === 'global' && portalTarget ? createPortal(content, portalTarget) : content;\n }\n);\n\nexport default Progress;\n"]}

package/lib/components/Progress/Ring.js CHANGED Viewed

@@ -69,7 +69,7 @@ const Ring = forwardRef(({ value, minValue = 0, maxValue = 100, placement, ...re
         strokeDashoffset = circumference;
     else
         strokeDashoffset = (1 - (value - minValue) / (maxValue - minValue)) * circumference;
-    return (_jsx(StyledProgressRing, Object.assign({ ref: ref, role: 'progressbar', "aria-valuemin": minValue, "aria-valuemax": maxValue, "aria-valuenow": value, placement: placement, determinate: typeof value === 'number' }, restProps, { children: _jsxs("svg", Object.assign({ viewBox: '0 0 20 20' }, { children: [_jsx("circle", {}, void 0), _jsx("circle", { strokeDasharray: circumference, style: { strokeDashoffset } }, void 0)] }), void 0) }), void 0));
+    return (_jsx(StyledProgressRing, { ref: ref, role: 'progressbar', "aria-valuemin": minValue, "aria-valuemax": maxValue, "aria-valuenow": value, placement: placement, determinate: typeof value === 'number', ...restProps, children: _jsxs("svg", { viewBox: '0 0 20 20', children: [_jsx("circle", {}, void 0), _jsx("circle", { strokeDasharray: circumference, style: { strokeDashoffset } }, void 0)] }, void 0) }, void 0));
 });
 export default Ring;
 //# sourceMappingURL=Ring.js.map

package/lib/components/Progress/Ring.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Ring.js","sourceRoot":"","sources":["../../../src/components/Progress/Ring.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAM,UAAU,EAAmB,MAAM,OAAO,CAAC;AACxD,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAK/C,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAC1C,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,EAAE,EAAE;IACpC,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;oBAsBM,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,aAAa,CAAC;;;;;;;;;sBASnC,KAAK,CAAC,UAAU,CAAC,QAAQ,CAAC,gBAAgB,CAAC;uDACV,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK;gBACjE,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI;;cAElC,CAAC,WAAW;QACd,GAAG,CAAA;gDACiC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK;aAC7D;;;;;QAKL,SAAS,KAAK,QAAQ;QACtB,CAAC,CAAC,GAAG,CAAA;;;WAGF;QACH,CAAC,CAAC,GAAG,CAAA;qBACQ,SAAS,KAAK,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG;sBACjC,SAAS,KAAK,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG;WAC7C;KACN,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,kBAAkB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEnD,MAAM,IAAI,GAAqC,UAAU,CACvD,CACE,EACE,KAAK,EACL,QAAQ,GAAG,CAAC,EACZ,QAAQ,GAAG,GAAG,EACd,SAAS,EACT,GAAG,SAAS,EACmB,EACjC,GAAyB,EACzB,EAAE;IACF,IAAI,gBAAgB,CAAC;IACrB,MAAM,aAAa,GAAG,EAAE,GAAG,IAAI,CAAC,EAAE,CAAC;IAEnC,IAAI,OAAO,KAAK,KAAK,QAAQ;QAAE,gBAAgB,GAAG,CAAC,CAAC,GAAG,EAAE,GAAG,GAAG,CAAC,GAAG,aAAa,CAAC;SAC5E,IAAI,KAAK,GAAG,QAAQ,IAAI,QAAQ,GAAG,QAAQ;QAAE,gBAAgB,GAAG,CAAC,CAAC;SAClE,IAAI,KAAK,GAAG,QAAQ;QAAE,gBAAgB,GAAG,aAAa,CAAC;;QACvD,gBAAgB,GAAG,CAAC,CAAC,GAAG,CAAC,KAAK,GAAG,QAAQ,CAAC,GAAG,CAAC,QAAQ,GAAG,QAAQ,CAAC,CAAC,GAAG,aAAa,CAAC;IAEzF,OAAO,CACL,KAAC,kBAAkB,~~kBACjB~~,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,aAAa,mBACH,QAAQ,mBACR,QAAQ,mBACR,KAAK,EACpB,SAAS,EAAE,SAAS,EACpB,WAAW,EAAE,OAAO,KAAK,KAAK,QAAQ,~~IAClC~~,SAAS,~~cAEb~~,~~6BAAK~~,OAAO,EAAC,WAAW,~~iBACtB~~,0BAAU,EACV,iBAAQ,eAAe,EAAE,aAAa,EAAE,KAAK,EAAE,EAAE,gBAAgB,EAAE,WAAI,~~aACnE~~,~~YACa~~,CACtB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,IAAI,CAAC","sourcesContent":["import { FC, forwardRef, PropsWithoutRef } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport { ForwardProps } from '../../types';\n\nimport { ProgressProps } from './Progress.types';\n\nexport const StyledProgressRing = styled.div<ProgressProps & { determinate: boolean }>(\n ({ theme, placement, determinate }) => {\n return css`\n position: relative;\n min-width: 1em;\n min-height: 1em;\n\n @keyframes LoadingRing {\n 0% {\n transform: rotate(0deg);\n }\n\n 100% {\n transform: rotate(360deg);\n }\n }\n\n svg {\n display: block;\n position: absolute;\n height: 100%;\n\n circle {\n fill: transparent;\n stroke: ${theme.base.colors.gray['extra-light']};\n stroke-width: 2;\n r: 45%;\n cx: 50%;\n cy: 50%;\n transform: rotate(-90deg);\n transform-origin: 50% 50%;\n\n &:nth-child(2) {\n stroke: ${theme.components.progress['progress-color']};\n transition: stroke-dashoffset calc(0.5 * ${theme.base.animation.speed})\n ${theme.base.animation.timing.ease};\n\n ${!determinate &&\n css`\n animation: LoadingRing calc(4 * ${theme.base.animation.speed}) linear infinite;\n `}\n }\n }\n }\n\n ${placement === 'inline'\n ? css`\n display: inline-flex;\n vertical-align: top;\n `\n : css`\n width: ${placement === 'global' ? '4' : '2'}rem;\n height: ${placement === 'global' ? '4' : '2'}rem;\n `}\n `;\n }\n);\n\nStyledProgressRing.defaultProps = defaultThemeProp;\n\nconst Ring: FC<ProgressProps & ForwardProps> = forwardRef(\n (\n {\n value,\n minValue = 0,\n maxValue = 100,\n placement,\n ...restProps\n }: PropsWithoutRef<ProgressProps>,\n ref: ProgressProps['ref']\n ) => {\n let strokeDashoffset;\n const circumference = 18 * Math.PI;\n\n if (typeof value !== 'number') strokeDashoffset = (1 - 33 / 100) * circumference;\n else if (value > maxValue \|\| minValue > maxValue) strokeDashoffset = 0;\n else if (value < minValue) strokeDashoffset = circumference;\n else strokeDashoffset = (1 - (value - minValue) / (maxValue - minValue)) * circumference;\n\n return (\n <StyledProgressRing\n ref={ref}\n role='progressbar'\n aria-valuemin={minValue}\n aria-valuemax={maxValue}\n aria-valuenow={value}\n placement={placement}\n determinate={typeof value === 'number'}\n {...restProps}\n >\n <svg viewBox='0 0 20 20'>\n <circle />\n <circle strokeDasharray={circumference} style={{ strokeDashoffset }} />\n </svg>\n </StyledProgressRing>\n );\n }\n);\n\nexport default Ring;\n"]}
1	+ {"version":3,"file":"Ring.js","sourceRoot":"","sources":["../../../src/components/Progress/Ring.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAM,UAAU,EAAmB,MAAM,OAAO,CAAC;AACxD,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAK/C,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAC1C,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,WAAW,EAAE,EAAE,EAAE;IACpC,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;oBAsBM,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,aAAa,CAAC;;;;;;;;;sBASnC,KAAK,CAAC,UAAU,CAAC,QAAQ,CAAC,gBAAgB,CAAC;uDACV,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK;gBACjE,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI;;cAElC,CAAC,WAAW;QACd,GAAG,CAAA;gDACiC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK;aAC7D;;;;;QAKL,SAAS,KAAK,QAAQ;QACtB,CAAC,CAAC,GAAG,CAAA;;;WAGF;QACH,CAAC,CAAC,GAAG,CAAA;qBACQ,SAAS,KAAK,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG;sBACjC,SAAS,KAAK,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG;WAC7C;KACN,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,kBAAkB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEnD,MAAM,IAAI,GAAqC,UAAU,CACvD,CACE,EACE,KAAK,EACL,QAAQ,GAAG,CAAC,EACZ,QAAQ,GAAG,GAAG,EACd,SAAS,EACT,GAAG,SAAS,EACmB,EACjC,GAAyB,EACzB,EAAE;IACF,IAAI,gBAAgB,CAAC;IACrB,MAAM,aAAa,GAAG,EAAE,GAAG,IAAI,CAAC,EAAE,CAAC;IAEnC,IAAI,OAAO,KAAK,KAAK,QAAQ;QAAE,gBAAgB,GAAG,CAAC,CAAC,GAAG,EAAE,GAAG,GAAG,CAAC,GAAG,aAAa,CAAC;SAC5E,IAAI,KAAK,GAAG,QAAQ,IAAI,QAAQ,GAAG,QAAQ;QAAE,gBAAgB,GAAG,CAAC,CAAC;SAClE,IAAI,KAAK,GAAG,QAAQ;QAAE,gBAAgB,GAAG,aAAa,CAAC;;QACvD,gBAAgB,GAAG,CAAC,CAAC,GAAG,CAAC,KAAK,GAAG,QAAQ,CAAC,GAAG,CAAC,QAAQ,GAAG,QAAQ,CAAC,CAAC,GAAG,aAAa,CAAC;IAEzF,OAAO,CACL,KAAC,kBAAkB,IACjB,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,aAAa,mBACH,QAAQ,mBACR,QAAQ,mBACR,KAAK,EACpB,SAAS,EAAE,SAAS,EACpB,WAAW,EAAE,OAAO,KAAK,KAAK,QAAQ,KAClC,SAAS,YAEb,eAAK,OAAO,EAAC,WAAW,aACtB,0BAAU,EACV,iBAAQ,eAAe,EAAE,aAAa,EAAE,KAAK,EAAE,EAAE,gBAAgB,EAAE,WAAI,YACnE,WACa,CACtB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,IAAI,CAAC","sourcesContent":["import { FC, forwardRef, PropsWithoutRef } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '../../theme';\nimport { ForwardProps } from '../../types';\n\nimport { ProgressProps } from './Progress.types';\n\nexport const StyledProgressRing = styled.div<ProgressProps & { determinate: boolean }>(\n ({ theme, placement, determinate }) => {\n return css`\n position: relative;\n min-width: 1em;\n min-height: 1em;\n\n @keyframes LoadingRing {\n 0% {\n transform: rotate(0deg);\n }\n\n 100% {\n transform: rotate(360deg);\n }\n }\n\n svg {\n display: block;\n position: absolute;\n height: 100%;\n\n circle {\n fill: transparent;\n stroke: ${theme.base.colors.gray['extra-light']};\n stroke-width: 2;\n r: 45%;\n cx: 50%;\n cy: 50%;\n transform: rotate(-90deg);\n transform-origin: 50% 50%;\n\n &:nth-child(2) {\n stroke: ${theme.components.progress['progress-color']};\n transition: stroke-dashoffset calc(0.5 * ${theme.base.animation.speed})\n ${theme.base.animation.timing.ease};\n\n ${!determinate &&\n css`\n animation: LoadingRing calc(4 * ${theme.base.animation.speed}) linear infinite;\n `}\n }\n }\n }\n\n ${placement === 'inline'\n ? css`\n display: inline-flex;\n vertical-align: top;\n `\n : css`\n width: ${placement === 'global' ? '4' : '2'}rem;\n height: ${placement === 'global' ? '4' : '2'}rem;\n `}\n `;\n }\n);\n\nStyledProgressRing.defaultProps = defaultThemeProp;\n\nconst Ring: FC<ProgressProps & ForwardProps> = forwardRef(\n (\n {\n value,\n minValue = 0,\n maxValue = 100,\n placement,\n ...restProps\n }: PropsWithoutRef<ProgressProps>,\n ref: ProgressProps['ref']\n ) => {\n let strokeDashoffset;\n const circumference = 18 * Math.PI;\n\n if (typeof value !== 'number') strokeDashoffset = (1 - 33 / 100) * circumference;\n else if (value > maxValue \|\| minValue > maxValue) strokeDashoffset = 0;\n else if (value < minValue) strokeDashoffset = circumference;\n else strokeDashoffset = (1 - (value - minValue) / (maxValue - minValue)) * circumference;\n\n return (\n <StyledProgressRing\n ref={ref}\n role='progressbar'\n aria-valuemin={minValue}\n aria-valuemax={maxValue}\n aria-valuenow={value}\n placement={placement}\n determinate={typeof value === 'number'}\n {...restProps}\n >\n <svg viewBox='0 0 20 20'>\n <circle />\n <circle strokeDasharray={circumference} style={{ strokeDashoffset }} />\n </svg>\n </StyledProgressRing>\n );\n }\n);\n\nexport default Ring;\n"]}

package/lib/components/RadioButton/RadioButton.js CHANGED Viewed

@@ -2,7 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef } from 'react';
 import RadioCheck from '../RadioCheck';
 // Odd issue with SB doc prop table not being generated when called RadioButton...so using RB
-const RB = forwardRef((props, ref) => (_jsx(RadioCheck, Object.assign({}, props, { type: 'radio', ref: ref }), void 0)));
+const RB = forwardRef((props, ref) => (_jsx(RadioCheck, { ...props, type: 'radio', ref: ref }, void 0)));
 // Adding here for doc purposes only
 RB.defaultProps = RadioCheck.defaultProps;
 export default RB;

package/lib/components/RadioButton/RadioButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RadioButton.js","sourceRoot":"","sources":["../../../src/components/RadioButton/RadioButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAM,UAAU,EAAO,MAAM,OAAO,CAAC;AAG5C,OAAO,UAA+B,MAAM,eAAe,CAAC;AA8B5D,6FAA6F;AAC7F,MAAM,EAAE,GAAwC,UAAU,CACxD,CAAC,KAAuB,EAAE,GAA0B,EAAE,EAAE,CAAC,CACvD,KAAC,UAAU,~~oBAAK~~,KAAK,~~IAAE~~,IAAI,EAAC,OAAO,EAAC,GAAG,EAAE,GAAG,~~YAAI~~,CACjD,CACF,CAAC;AAEF,oCAAoC;AACpC,EAAE,CAAC,YAAY,GAAG,UAAU,CAAC,YAAY,CAAC;AAE1C,eAAe,EAAE,CAAC","sourcesContent":["import { FC, forwardRef, Ref } from 'react';\n\nimport { FormControlProps } from '../FormControl';\nimport RadioCheck, { RadioCheckProps } from '../RadioCheck';\nimport { ForwardProps } from '../../types';\n\nexport interface RadioButtonProps {\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 /* 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 checked prop via onChange when using as controlled component. /\n checked?: RadioCheckProps['checked'];\n /* Initialize checked prop when using as uncontrolled component. /\n defaultChecked?: RadioCheckProps['defaultChecked'];\n /\n Sets Radio Button to an an [indeterminate state](https://css-tricks.com/almanac/selectors/i/indeterminate/#indeterminate-radio-buttons).\n * @default false\n */\n indeterminate?: RadioCheckProps['indeterminate'];\n}\n\n// Odd issue with SB doc prop table not being generated when called RadioButton...so using RB\nconst RB: FC<RadioButtonProps & ForwardProps> = forwardRef(\n (props: RadioButtonProps, ref: Ref<HTMLInputElement>) => (\n <RadioCheck {...props} type='radio' ref={ref} />\n )\n);\n\n// Adding here for doc purposes only\nRB.defaultProps = RadioCheck.defaultProps;\n\nexport default RB;\n"]}
1	+ {"version":3,"file":"RadioButton.js","sourceRoot":"","sources":["../../../src/components/RadioButton/RadioButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAM,UAAU,EAAO,MAAM,OAAO,CAAC;AAG5C,OAAO,UAA+B,MAAM,eAAe,CAAC;AA8B5D,6FAA6F;AAC7F,MAAM,EAAE,GAAwC,UAAU,CACxD,CAAC,KAAuB,EAAE,GAA0B,EAAE,EAAE,CAAC,CACvD,KAAC,UAAU,OAAK,KAAK,EAAE,IAAI,EAAC,OAAO,EAAC,GAAG,EAAE,GAAG,WAAI,CACjD,CACF,CAAC;AAEF,oCAAoC;AACpC,EAAE,CAAC,YAAY,GAAG,UAAU,CAAC,YAAY,CAAC;AAE1C,eAAe,EAAE,CAAC","sourcesContent":["import { FC, forwardRef, Ref } from 'react';\n\nimport { FormControlProps } from '../FormControl';\nimport RadioCheck, { RadioCheckProps } from '../RadioCheck';\nimport { ForwardProps } from '../../types';\n\nexport interface RadioButtonProps {\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 /* 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 checked prop via onChange when using as controlled component. /\n checked?: RadioCheckProps['checked'];\n /* Initialize checked prop when using as uncontrolled component. /\n defaultChecked?: RadioCheckProps['defaultChecked'];\n /\n Sets Radio Button to an an [indeterminate state](https://css-tricks.com/almanac/selectors/i/indeterminate/#indeterminate-radio-buttons).\n * @default false\n */\n indeterminate?: RadioCheckProps['indeterminate'];\n}\n\n// Odd issue with SB doc prop table not being generated when called RadioButton...so using RB\nconst RB: FC<RadioButtonProps & ForwardProps> = forwardRef(\n (props: RadioButtonProps, ref: Ref<HTMLInputElement>) => (\n <RadioCheck {...props} type='radio' ref={ref} />\n )\n);\n\n// Adding here for doc purposes only\nRB.defaultProps = RadioCheck.defaultProps;\n\nexport default RB;\n"]}

package/lib/components/RadioCheck/RadioCheck.js CHANGED Viewed

@@ -194,7 +194,7 @@ const RadioCheck = forwardRef((props, ref) => {
             newRef.current.indeterminate = !!indeterminate;
         }
     }, [newRef, indeterminate, isRadio]);
-    return (_jsx(FormField, Object.assign({ as: card ? StyledRadioCheckCard : StyledRadioCheck, label: _jsxs(_Fragment, { children: [_jsx(StyledPseudoRadioCheck, { status: status, isRadio: isRadio, as: StyledFormControl, required: required, disabled: disabled, readOnly: readOnly }, void 0), label] }, void 0), labelAs: card ? 'div' : undefined, id: id, required: required, disabled: disabled, readOnly: readOnly, status: status, inline: true, labelAfter: true }, { children: _jsx(StyledRadioCheckInput, Object.assign({}, restProps, { id: id, type: type, required: required, disabled: disabled, readOnly: readOnly, "aria-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 }, void 0), label] }, void 0), labelAs: card ? 'div' : undefined, id: id, required: required, disabled: disabled, readOnly: readOnly, status: status, inline: true, labelAfter: true, children: _jsx(StyledRadioCheckInput, { ...restProps, id: id, type: type, required: required, disabled: disabled, readOnly: readOnly, "aria-readonly": readOnly, onClick: (e) => {
                 if (readOnly)
                     e.preventDefault();
                 onClick?.(e);
@@ -206,7 +206,7 @@ const RadioCheck = forwardRef((props, ref) => {
                     e.preventDefault();
                 }
                 onKeyDown?.(e);
-            }, ref: newRef }), void 0) }), void 0));
+            }, ref: newRef }, void 0) }, void 0));
 });
 export default RadioCheck;
 //# sourceMappingURL=RadioCheck.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"RadioCheck.js","sourceRoot":"","sources":["../../../src/components/RadioCheck/RadioCheck.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n FC,\n Ref,\n useEffect,\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 from '../FormField';\nimport { FormControlProps, StyledFormControl } from '../FormControl';\nimport { defaultThemeProp } from '../../theme';\nimport { tryCatch } from '../../utils/utils';\nimport { BaseProps, ForwardProps } from '../../types';\nimport { useConsolidatedRef, useDirection, useUID } from '../../hooks';\nimport { StyledLabel } from '../Label';\nimport { calculateFontSize } from '../../styles';\n\nexport interface RadioCheckProps extends BaseProps {\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 /* 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 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 ':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\n ${!(props.disabled \|\| props.readOnly) &&\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 ${!(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 align-items: start;\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: grid;\n grid-template-columns: auto 1fr;\n color: ${label.color};\n font-weight: ${label['font-weight']};\n }\n `;\n }\n);\n\nStyledRadioCheckCard.defaultProps = defaultThemeProp;\n\nconst RadioCheck: FC<RadioCheckProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<RadioCheckProps>, ref: RadioCheckProps['ref']) => {\n const uid = useUID();\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 ...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 {label}\n </>\n }\n labelAs={card ? 'div' : undefined}\n id={id}\n required={required}\n disabled={disabled}\n readOnly={readOnly}\n status={status}\n inline\n labelAfter\n >\n <StyledRadioCheckInput\n {...restProps}\n id={id}\n type={type}\n required={required}\n disabled={disabled}\n readOnly={readOnly}\n aria-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);\n\nexport default RadioCheck;\n"]}
1	+ {"version":3,"file":"RadioCheck.js","sourceRoot":"","sources":["../../../src/components/RadioCheck/RadioCheck.tsx"],"names":[],"mappings":";AAAA,OAAO,EACL,UAAU,EAGV,SAAS,EAMV,MAAM,OAAO,CAAC;AACf,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAE5D,OAAO,SAAS,MAAM,cAAc,CAAC;AACrC,OAAO,EAAoB,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACrE,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C,OAAO,EAAE,kBAAkB,EAAE,YAAY,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACvE,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AACvC,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AA4CjD,MAAM,CAAC,MAAM,sBAAsB,GAAG,MAAM,CAAC,GAAG,CAC9C,KAAK,CAAC,EAAE;IACN,MAAM,EACJ,KAAK,EAAE,EACL,IAAI,EAAE,EACJ,OAAO,EACP,OAAO,EAAE,EAAE,oBAAoB,EAAE,iBAAiB,EAAE,EACrD,EACD,UAAU,EAAE,EACV,YAAY,EAAE,SAAS,EACvB,aAAa,EAAE,EACb,IAAI,EACJ,YAAY,EAAE,SAAS,EACvB,kBAAkB,EAAE,eAAe,EACnC,cAAc,EAAE,WAAW,EAC3B,cAAc,EAAE,WAAW,EAC5B,EACF,EACF,EACD,MAAM,EACP,GAAG,KAAK,CAAC;IAEV,MAAM,cAAc,GAAG,MAAM,KAAK,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC;IAC1F,MAAM,kBAAkB,GACtB,MAAM,IAAI,SAAS,CAAC,MAAM,CAAC;QACzB,CAAC,CAAC,QAAQ,CAAC,GAAG,EAAE,CAAC,GAAG,CAAC,GAAG,EAAE,iBAAiB,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC;QAChF,CAAC,CAAC,eAAe,CAAC;IAEtB,OAAO,GAAG,CAAA;;;;eAIC,IAAI;gBACH,IAAI;2BACO,OAAO;gBAClB,WAAW,UAAU,cAAc;0BACzB,kBAAkB;;;iBAG3B,SAAS;kBACR,SAAS;;;;;;;KAOtB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,sBAAsB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEvD,MAAM,CAAC,MAAM,qBAAqB,GAAG,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE;IACxD,MAAM,EACJ,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,eAAe,EAAE,gBAAgB,EAAE,EAC3C,UAAU,EAAE,EACV,cAAc,EAAE,EACd,QAAQ,EAAE,EAAE,YAAY,EAAE,MAAM,EAAE,cAAc,EAAE,gBAAgB,EAAE,EACpE,YAAY,EAAE,EAAE,kBAAkB,EAAE,uBAAuB,EAAE,EAC9D,EACD,aAAa,EAAE,EACb,UAAU,EAAE,EACV,kBAAkB,EAAE,sBAAsB,EAC1C,cAAc,EAAE,kBAAkB,EACnC,EACF,EACD,QAAQ,EAAE,EAAE,eAAe,EAAE,WAAW,EAAE,EAC1C,cAAc,EAAE,EAAE,eAAe,EAAE,WAAW,EAAE,EACjD,EACF,EACF,GAAG,KAAK,CAAC;IAEV,MAAM,eAAe,GAAG,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,uBAAuB,CAAC,CAAC,CAAC,sBAAsB,CAAC;IAC1F,MAAM,UAAU,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,aAAa,CAAC,eAAe,CAAC,CAAC,CAAC;IAElE,MAAM,WAAW,GAAG,KAAK,WAAW,IAAI,sBAAsB,EAAE,CAAC;IACjE,MAAM,EAAE,GAAG,EAAE,GAAG,YAAY,EAAE,CAAC;IAE/B,OAAO,GAAG,CAAA;MACN,YAAY;;MAEZ,CAAC,CAAC,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,QAAQ,CAAC;QACrC,GAAG,CAAA;gBACS,WAAW;sBACL,MAAM;wBACJ,gBAAgB;;KAEnC;;;QAGG,WAAW;;QAEX,WAAW;;QAEX,WAAW;;QAEX,WAAW;sBACG,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,kBAAkB;0BAC3C,eAAe;;;;;;;sBAOnB,WAAW,qBAAqB,WAAW;uBAC1C,WAAW;;;sBAGZ,WAAW;;;;0BAIP,UAAU;;;;yBAIX,WAAW;gCACJ,gBAAgB,MAAM,WAAW;;;6CAGpB,WAAW;;;;UAI9C,GAAG;QACH,CAAC,CAAC,GAAG,CAAA;;aAEF;QACH,CAAC,CAAC,GAAG,CAAA;;aAEF;qCACwB,UAAU;sCACT,UAAU;;;;uCAIT,WAAW;;;;;;4BAMtB,UAAU;;;GAGnC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,qBAAqB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEtD,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,GAAG,CACxC,KAAK,CAAC,EAAE;IACN,MAAM,EACJ,QAAQ,EACR,QAAQ,EACR,KAAK,EAAE,EACL,IAAI,EACJ,UAAU,EAAE,EACV,aAAa,EAAE,EACb,KAAK,EAAE,EAAE,KAAK,EAAE,UAAU,EAAE,aAAa,EAAE,eAAe,EAAE,EAC7D,EACD,cAAc,EAAE,EACd,QAAQ,EAAE,EAAE,cAAc,EAAE,gBAAgB,EAAE,EAC/C,EACF,EACF,EACF,GAAG,KAAK,CAAC;IAEV,MAAM,QAAQ,GAAG,iBAAiB,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC;IAE1E,OAAO,GAAG,CAAA;UACJ,WAAW;;;;uBAIE,eAAe;;qBAEjB,QAAQ,CAAC,CAAC;iBACd,UAAU;;sBAEL,IAAI,CAAC,UAAU,CAAC,CAAC,WAAW,CAAC;;;wBAG3B,IAAI,CAAC,UAAU,CAAC,CAAC,YAAY,CAAC;;;;QAI9C,CAAC,CAAC,QAAQ,IAAI,QAAQ,CAAC;QACzB,GAAG,CAAA;iCACwB,WAAW,UAAU,sBAAsB;0BAClD,gBAAgB;;OAEnC;KACF,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEjD,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,KAAK,CAG9C,CAAC,EACC,QAAQ,EACR,QAAQ,EACR,MAAM,EACN,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,EAClC,UAAU,EAAE,EACV,IAAI,EACJ,YAAY,EAAE,SAAS,EACvB,aAAa,EAAE,EAAE,KAAK,EAAE,EACxB,cAAc,EAAE,EACd,QAAQ,EAAE,EAAE,cAAc,EAAE,gBAAgB,EAAE,EAC/C,EACF,EACF,EACF,EAAE,EAAE;IACH,MAAM,cAAc,GAClB,MAAM,KAAK,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;IAEhF,OAAO,GAAG,CAAA;;;;0BAIY,IAAI,CAAC,UAAU;uBAClB,IAAI,CAAC,eAAe,CAAC;gCACZ,cAAc;iBAC7B,OAAO;;QAEhB,QAAQ;QACV,GAAG,CAAA;;OAEF;;QAEC,CAAC,CAAC,QAAQ,IAAI,QAAQ,CAAC;QACzB,GAAG,CAAA;;0BAEiB,gBAAgB;YAC9B,WAAW,IAAI,sBAAsB;4BACrB,gBAAgB;;;;;wBAKpB,MAAM,CAAC,KAAK;;;OAG7B;;QAEC,WAAW;;;iBAGF,KAAK,CAAC,KAAK;uBACL,KAAK,CAAC,aAAa,CAAC;;KAEtC,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,oBAAoB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAErD,MAAM,UAAU,GAAuC,UAAU,CAC/D,CAAC,KAAuC,EAAE,GAA2B,EAAE,EAAE;IACvE,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;IACrB,MAAM,EACJ,IAAI,EACJ,EAAE,GAAG,GAAG,EACR,KAAK,EACL,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,KAAK,EAChB,aAAa,GAAG,KAAK,EACrB,QAAQ,GAAG,KAAK,EAChB,OAAO,GAAG,QAAQ,EAClB,OAAO,EACP,SAAS,EACT,MAAM,EACN,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IAEV,MAAM,OAAO,GAAG,IAAI,KAAK,OAAO,CAAC;IACjC,MAAM,IAAI,GAAG,OAAO,KAAK,MAAM,CAAC;IAChC,MAAM,MAAM,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC;IAEvC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,OAAO,IAAI,MAAM,CAAC,OAAO,EAAE;YAC9B,MAAM,CAAC,OAAO,CAAC,aAAa,GAAG,CAAC,CAAC,aAAa,CAAC;SAChD;IACH,CAAC,EAAE,CAAC,MAAM,EAAE,aAAa,EAAE,OAAO,CAAC,CAAC,CAAC;IAErC,OAAO,CACL,KAAC,SAAS,IACR,EAAE,EAAE,IAAI,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,gBAAgB,EAClD,KAAK,EACH,8BACE,KAAC,sBAAsB,IACrB,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,OAAO,EAChB,EAAE,EAAE,iBAAiB,EACrB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,WAClB,EACD,KAAK,YACL,EAEL,OAAO,EAAE,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,EACjC,EAAE,EAAE,EAAE,EACN,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,EACd,MAAM,QACN,UAAU,kBAEV,KAAC,qBAAqB,OAChB,SAAS,EACb,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,mBACH,QAAQ,EACvB,OAAO,EAAE,CAAC,CAA+B,EAAE,EAAE;gBAC3C,IAAI,QAAQ;oBAAE,CAAC,CAAC,cAAc,EAAE,CAAC;gBAEjC,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC;YACf,CAAC,EACD,SAAS,EAAE,CAAC,CAAkC,EAAE,EAAE;gBAChD,IAAI,IAAI,KAAK,UAAU,IAAI,QAAQ,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,EAAE;oBACpD,CAAC,CAAC,cAAc,EAAE,CAAC;iBACpB;gBACD,IAAI,IAAI,KAAK,OAAO,IAAI,QAAQ,IAAI,CAAC,CAAC,GAAG,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE;oBAC3D,CAAC,CAAC,cAAc,EAAE,CAAC;iBACpB;gBAED,SAAS,EAAE,CAAC,CAAC,CAAC,CAAC;YACjB,CAAC,EACD,GAAG,EAAE,MAAM,WACX,WACQ,CACb,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,UAAU,CAAC","sourcesContent":["import {\n forwardRef,\n FC,\n Ref,\n useEffect,\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 from '../FormField';\nimport { FormControlProps, StyledFormControl } from '../FormControl';\nimport { defaultThemeProp } from '../../theme';\nimport { tryCatch } from '../../utils/utils';\nimport { BaseProps, ForwardProps } from '../../types';\nimport { useConsolidatedRef, useDirection, useUID } from '../../hooks';\nimport { StyledLabel } from '../Label';\nimport { calculateFontSize } from '../../styles';\n\nexport interface RadioCheckProps extends BaseProps {\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 /* 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 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 ':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\n ${!(props.disabled \|\| props.readOnly) &&\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 ${!(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 align-items: start;\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: grid;\n grid-template-columns: auto 1fr;\n color: ${label.color};\n font-weight: ${label['font-weight']};\n }\n `;\n }\n);\n\nStyledRadioCheckCard.defaultProps = defaultThemeProp;\n\nconst RadioCheck: FC<RadioCheckProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<RadioCheckProps>, ref: RadioCheckProps['ref']) => {\n const uid = useUID();\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 ...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 {label}\n </>\n }\n labelAs={card ? 'div' : undefined}\n id={id}\n required={required}\n disabled={disabled}\n readOnly={readOnly}\n status={status}\n inline\n labelAfter\n >\n <StyledRadioCheckInput\n {...restProps}\n id={id}\n type={type}\n required={required}\n disabled={disabled}\n readOnly={readOnly}\n aria-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);\n\nexport default RadioCheck;\n"]}

package/lib/components/RadioCheckGroup/RadioCheckGroup.js CHANGED Viewed

@@ -47,18 +47,18 @@ const RadioCheckGroup = forwardRef((props, ref) => {
             };
         }
     }, [optionsEl, inline, autoStack]);
-    return (_jsx(FormField, Object.assign({}, {
-        as: StyledRadioCheckGroup,
-        labelAs: 'legend',
-        ref,
-        name,
-        disabled,
-        ...restProps
-    }, { children: _jsx(Grid, Object.assign({ ref: setOptionsEl, container: {
+    return (_jsx(FormField, { ...{
+            as: StyledRadioCheckGroup,
+            labelAs: 'legend',
+            ref,
+            name,
+            disabled,
+            ...restProps
+        }, children: _jsx(Grid, { ref: setOptionsEl, container: {
                 colGap: 1,
                 rowGap: variant === 'card' ? 1 : 0,
                 cols: renderInline ? 'repeat(auto-fit, minmax(1ch, max-content))' : '1fr'
-            } }, { children: Children.map(children, child => cloneElement(child, {
+            }, children: Children.map(children, child => cloneElement(child, {
                 name,
                 disabled: disabled || child.props.disabled,
                 readOnly: readOnly || child.props.readOnly,
@@ -71,7 +71,7 @@ const RadioCheckGroup = forwardRef((props, ref) => {
                         }
                     }
                     : child.props.onChange
-            })) }), void 0) }), void 0));
+            })) }, void 0) }, void 0));
 });
 RadioCheckGroup.defaultProps = defaultProps;
 export default RadioCheckGroup;

package/lib/components/RadioCheckGroup/RadioCheckGroup.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RadioCheckGroup.js","sourceRoot":"","sources":["../../../src/components/RadioCheckGroup/RadioCheckGroup.tsx"],"names":[],"mappings":";AAAA,OAAO,EAGL,UAAU,EAEV,QAAQ,EACR,YAAY,EAGZ,QAAQ,EACR,SAAS,EACT,MAAM,EACP,MAAM,OAAO,CAAC;AACf,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAGvC,OAAO,SAA6B,MAAM,cAAc,CAAC;AACzD,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AAGzD,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AA6CjD,MAAM,YAAY,GAAG;IACnB,QAAQ,EAAE,KAAK;IACf,QAAQ,EAAE,KAAK;CAChB,CAAC;AAEF,MAAM,qBAAqB,GAAG,MAAM,CAAC,QAAQ,CAAA;;QAErC,eAAe;;;;CAItB,CAAC;AAEF,MAAM,eAAe,GAA4C,UAAU,CACzE,CAAC,KAA4C,EAAE,GAAgC,EAAE,EAAE;IACjF,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;IACrB,MAAM,EACJ,QAAQ,EACR,IAAI,GAAG,GAAG,EACV,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,MAAM,GAAG,KAAK,EACd,SAAS,GAAG,IAAI,EAChB,OAAO,GAAG,QAAQ,EAClB,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IAEV,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,UAAU,EAAkB,CAAC;IAC/D,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,MAAM,CAAC,CAAC;IACzD,MAAM,eAAe,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC;IACvC,MAAM,cAAc,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC;IAEjC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,MAAM,IAAI,SAAS,IAAI,SAAS,EAAE;YACpC,MAAM,oBAAoB,GAAG,IAAI,oBAAoB,CACnD,OAAO,CAAC,EAAE;gBACR,IAAI,OAAO,CAAC,CAAC,CAAC,CAAC,iBAAiB,GAAG,CAAC,EAAE;oBACpC,IAAI,OAAO,CAAC,CAAC,CAAC,CAAC,UAAU;wBAAE,cAAc,CAAC,OAAO,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,KAAK,GAAG,CAAC,CAAC;oBACpF,eAAe,CAAC,OAAO,GAAG,KAAK,CAAC;oBAChC,eAAe,CAAC,KAAK,CAAC,CAAC;iBACxB;YACH,CAAC,EACD,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,EAAE,CAAC,EAAE,CAClC,CAAC;YAEF,MAAM,cAAc,GAAG,IAAI,cAAc,CAAC,OAAO,CAAC,EAAE;gBAClD,IAAI,CAAC,eAAe,CAAC,OAAO,IAAI,OAAO,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,KAAK,GAAG,cAAc,CAAC,OAAO,EAAE;oBACrF,eAAe,CAAC,OAAO,GAAG,IAAI,CAAC;oBAC/B,eAAe,CAAC,IAAI,CAAC,CAAC;iBACvB;YACH,CAAC,CAAC,CAAC;YAEH,oBAAoB,CAAC,OAAO,CAAC,SAAS,CAAC,SAAoB,CAAC,CAAC;YAC7D,cAAc,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;YAElC,OAAO,GAAG,EAAE;gBACV,oBAAoB,CAAC,UAAU,EAAE,CAAC;gBAClC,cAAc,CAAC,UAAU,EAAE,CAAC;YAC9B,CAAC,CAAC;SACH;IACH,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,SAAS,CAAC,CAAC,CAAC;IAEnC,OAAO,CACL,KAAC,SAAS,~~oBACJ~~;~~QACF~~,EAAE,EAAE,qBAAqB;~~QACzB~~,OAAO,EAAE,QAAQ;~~QACjB~~,GAAG;~~QACH~~,IAAI;~~QACJ~~,QAAQ;~~QACR~~,GAAG,SAAS;~~KACb~~,~~cAED~~,KAAC,IAAI,~~kBACH~~,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE;gBACT,MAAM,EAAE,CAAC;gBACT,MAAM,EAAE,OAAO,KAAK,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;gBAClC,IAAI,EAAE,YAAY,CAAC,CAAC,CAAC,4CAA4C,CAAC,CAAC,CAAC,KAAK;aAC1E,~~gBAEA~~,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,KAAK,CAAC,EAAE,CAC9B,YAAY,CAAC,KAAK,EAAE;gBAClB,IAAI;gBACJ,QAAQ,EAAE,QAAQ,IAAI,KAAK,CAAC,KAAK,CAAC,QAAQ;gBAC1C,QAAQ,EAAE,QAAQ,IAAI,KAAK,CAAC,KAAK,CAAC,QAAQ;gBAC1C,OAAO;gBACP,QAAQ,EAAE,QAAQ;oBAChB,CAAC,CAAC,CAAC,CAAgC,EAAE,EAAE;wBACnC,IAAI,CAAC,CAAC,QAAQ,IAAI,KAAK,CAAC,KAAK,CAAC,QAAQ,CAAC,EAAE;4BACvC,KAAK,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,CAAC;4BAC1B,QAAQ,CAAC,CAAC,CAAC,CAAC;yBACb;oBACH,CAAC;oBACH,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ;aACzB,CAAC,CACH,~~YACI~~,~~YACG~~,CACb,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,CAAC,YAAY,GAAG,YAAY,CAAC;AAE5C,eAAe,eAAe,CAAC","sourcesContent":["import {\n FC,\n Ref,\n forwardRef,\n PropsWithoutRef,\n Children,\n cloneElement,\n ReactElement,\n ChangeEvent,\n useState,\n useEffect,\n useRef\n} from 'react';\nimport styled from 'styled-components';\n\nimport { ForwardProps } from '../../types';\nimport FormField, { FormFieldProps } from '../FormField';\nimport { StyledFormField } from '../FormField/FormField';\nimport { FormControlProps } from '../FormControl';\nimport { RadioCheckProps } from '../RadioCheck';\nimport Grid from '../Grid';\nimport { useElement, useUID } from '../../hooks';\n\nexport interface RadioCheckGroupProps {\n /** Accepts Checkboxes or RadioButtons as children. /\n children: ReactElement \| ReactElement[];\n /\n Conveniently pass an onChange handler to the group to be notified when any of the inputs change.\n * Additionally, onChange can be passed to individual children.\n * Both handlers will be called, child followed by group.\n /\n onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n /* Set visual state based on a validation state. /\n status?: FormControlProps['status'];\n /* Pass a string or a fragment with an Icon and string. /\n label?: FormControlProps['label'];\n /* Visually hides the label region. /\n labelHidden?: FormControlProps['labelHidden'];\n /* It is recommended to pass a simple string to offer guidance. Text will be styled based on status prop. /\n info?: FormControlProps['info'];\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 /\n Layout field elements inline in a row.\n * @default false\n /\n inline?: FormFieldProps['inline'];\n /* Used to toggle the auto stacking feature of an inlined group.\n * @default true\n /\n autoStack?: boolean;\n /* Sets html name attribute for the underlying control. Useful for mapping to a data field. /\n name?: FormControlProps['name'];\n /\n Controls the styling of the child RadioChecks.\n * @default 'simple'\n /\n variant?: RadioCheckProps['variant'];\n /* Ref forwarded to the wrapping element. */\n ref?: Ref<HTMLElement>;\n}\n\nconst defaultProps = {\n required: false,\n disabled: false\n};\n\nconst StyledRadioCheckGroup = styled.fieldset`\n &[disabled] {\n > ${StyledFormField} {\n opacity: unset;\n }\n }\n`;\n\nconst RadioCheckGroup: FC<RadioCheckGroupProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<RadioCheckGroupProps>, ref: RadioCheckGroupProps['ref']) => {\n const uid = useUID();\n const {\n children,\n name = uid,\n disabled,\n onChange,\n readOnly,\n inline = false,\n autoStack = true,\n variant = 'simple',\n ...restProps\n } = props;\n\n const [optionsEl, setOptionsEl] = useElement<HTMLDivElement>();\n const [renderInline, setRenderInline] = useState(inline);\n const renderInlineRef = useRef(inline);\n const minInlineWidth = useRef(0);\n\n useEffect(() => {\n if (inline && optionsEl && autoStack) {\n const intersectionObserver = new IntersectionObserver(\n entries => {\n if (entries[0].intersectionRatio < 1) {\n if (entries[0].rootBounds) minInlineWidth.current = entries[0].rootBounds.width + 1;\n renderInlineRef.current = false;\n setRenderInline(false);\n }\n },\n { root: optionsEl, threshold: 1 }\n );\n\n const resizeObserver = new ResizeObserver(entries => {\n if (!renderInlineRef.current && entries[0].contentRect.width > minInlineWidth.current) {\n renderInlineRef.current = true;\n setRenderInline(true);\n }\n });\n\n intersectionObserver.observe(optionsEl.lastChild as Element);\n resizeObserver.observe(optionsEl);\n\n return () => {\n intersectionObserver.disconnect();\n resizeObserver.disconnect();\n };\n }\n }, [optionsEl, inline, autoStack]);\n\n return (\n <FormField\n {...{\n as: StyledRadioCheckGroup,\n labelAs: 'legend',\n ref,\n name,\n disabled,\n ...restProps\n }}\n >\n <Grid\n ref={setOptionsEl}\n container={{\n colGap: 1,\n rowGap: variant === 'card' ? 1 : 0,\n cols: renderInline ? 'repeat(auto-fit, minmax(1ch, max-content))' : '1fr'\n }}\n >\n {Children.map(children, child =>\n cloneElement(child, {\n name,\n disabled: disabled \|\| child.props.disabled,\n readOnly: readOnly \|\| child.props.readOnly,\n variant,\n onChange: onChange\n ? (e: ChangeEvent<HTMLInputElement>) => {\n if (!(readOnly \|\| child.props.readOnly)) {\n child.props.onChange?.(e);\n onChange(e);\n }\n }\n : child.props.onChange\n })\n )}\n </Grid>\n </FormField>\n );\n }\n);\n\nRadioCheckGroup.defaultProps = defaultProps;\n\nexport default RadioCheckGroup;\n"]}
1	+ {"version":3,"file":"RadioCheckGroup.js","sourceRoot":"","sources":["../../../src/components/RadioCheckGroup/RadioCheckGroup.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n FC,\n Ref,\n forwardRef,\n PropsWithoutRef,\n Children,\n cloneElement,\n ReactElement,\n ChangeEvent,\n useState,\n useEffect,\n useRef\n} from 'react';\nimport styled from 'styled-components';\n\nimport { ForwardProps } from '../../types';\nimport FormField, { FormFieldProps } from '../FormField';\nimport { StyledFormField } from '../FormField/FormField';\nimport { FormControlProps } from '../FormControl';\nimport { RadioCheckProps } from '../RadioCheck';\nimport Grid from '../Grid';\nimport { useElement, useUID } from '../../hooks';\n\nexport interface RadioCheckGroupProps {\n /** Accepts Checkboxes or RadioButtons as children. /\n children: ReactElement \| ReactElement[];\n /\n Conveniently pass an onChange handler to the group to be notified when any of the inputs change.\n * Additionally, onChange can be passed to individual children.\n * Both handlers will be called, child followed by group.\n /\n onChange?: (e: ChangeEvent<HTMLInputElement>) => void;\n /* Set visual state based on a validation state. /\n status?: FormControlProps['status'];\n /* Pass a string or a fragment with an Icon and string. /\n label?: FormControlProps['label'];\n /* Visually hides the label region. /\n labelHidden?: FormControlProps['labelHidden'];\n /* It is recommended to pass a simple string to offer guidance. Text will be styled based on status prop. /\n info?: FormControlProps['info'];\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 /\n Layout field elements inline in a row.\n * @default false\n /\n inline?: FormFieldProps['inline'];\n /* Used to toggle the auto stacking feature of an inlined group.\n * @default true\n /\n autoStack?: boolean;\n /* Sets html name attribute for the underlying control. Useful for mapping to a data field. /\n name?: FormControlProps['name'];\n /\n Controls the styling of the child RadioChecks.\n * @default 'simple'\n /\n variant?: RadioCheckProps['variant'];\n /* Ref forwarded to the wrapping element. */\n ref?: Ref<HTMLElement>;\n}\n\nconst defaultProps = {\n required: false,\n disabled: false\n};\n\nconst StyledRadioCheckGroup = styled.fieldset`\n &[disabled] {\n > ${StyledFormField} {\n opacity: unset;\n }\n }\n`;\n\nconst RadioCheckGroup: FC<RadioCheckGroupProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<RadioCheckGroupProps>, ref: RadioCheckGroupProps['ref']) => {\n const uid = useUID();\n const {\n children,\n name = uid,\n disabled,\n onChange,\n readOnly,\n inline = false,\n autoStack = true,\n variant = 'simple',\n ...restProps\n } = props;\n\n const [optionsEl, setOptionsEl] = useElement<HTMLDivElement>();\n const [renderInline, setRenderInline] = useState(inline);\n const renderInlineRef = useRef(inline);\n const minInlineWidth = useRef(0);\n\n useEffect(() => {\n if (inline && optionsEl && autoStack) {\n const intersectionObserver = new IntersectionObserver(\n entries => {\n if (entries[0].intersectionRatio < 1) {\n if (entries[0].rootBounds) minInlineWidth.current = entries[0].rootBounds.width + 1;\n renderInlineRef.current = false;\n setRenderInline(false);\n }\n },\n { root: optionsEl, threshold: 1 }\n );\n\n const resizeObserver = new ResizeObserver(entries => {\n if (!renderInlineRef.current && entries[0].contentRect.width > minInlineWidth.current) {\n renderInlineRef.current = true;\n setRenderInline(true);\n }\n });\n\n intersectionObserver.observe(optionsEl.lastChild as Element);\n resizeObserver.observe(optionsEl);\n\n return () => {\n intersectionObserver.disconnect();\n resizeObserver.disconnect();\n };\n }\n }, [optionsEl, inline, autoStack]);\n\n return (\n <FormField\n {...{\n as: StyledRadioCheckGroup,\n labelAs: 'legend',\n ref,\n name,\n disabled,\n ...restProps\n }}\n >\n <Grid\n ref={setOptionsEl}\n container={{\n colGap: 1,\n rowGap: variant === 'card' ? 1 : 0,\n cols: renderInline ? 'repeat(auto-fit, minmax(1ch, max-content))' : '1fr'\n }}\n >\n {Children.map(children, child =>\n cloneElement(child, {\n name,\n disabled: disabled \|\| child.props.disabled,\n readOnly: readOnly \|\| child.props.readOnly,\n variant,\n onChange: onChange\n ? (e: ChangeEvent<HTMLInputElement>) => {\n if (!(readOnly \|\| child.props.readOnly)) {\n child.props.onChange?.(e);\n onChange(e);\n }\n }\n : child.props.onChange\n })\n )}\n </Grid>\n </FormField>\n );\n }\n);\n\nRadioCheckGroup.defaultProps = defaultProps;\n\nexport default RadioCheckGroup;\n"]}

package/lib/components/Rating/Rating.js CHANGED Viewed

@@ -50,7 +50,7 @@ StyledRatingMetaInfo.defaultProps = defaultThemeProp;
 const RatingItem = (props) => {
     const { fill, ...restProps } = props;
     const fillPercentage = Math.round((100 / 1) * fill);
-    return (_jsxs(_Fragment, { children: [fillPercentage === 0 && _jsx(Icon, Object.assign({}, restProps, { name: 'star' }), void 0), fillPercentage === 100 && _jsx(Icon, Object.assign({}, restProps, { name: 'star-solid' }), void 0), fillPercentage > 0 && fillPercentage < 100 && (_jsxs(StyledPartialRatingContainer, { children: [_jsx(Icon, Object.assign({}, restProps, { name: 'star' }), void 0), _jsx(StyledPartialRating, Object.assign({ ratingPercentage: fillPercentage }, { children: _jsx(Icon, Object.assign({}, restProps, { name: 'star-solid' }), void 0) }), void 0)] }, void 0))] }, void 0));
+    return (_jsxs(_Fragment, { children: [fillPercentage === 0 && _jsx(Icon, { ...restProps, name: 'star' }, void 0), fillPercentage === 100 && _jsx(Icon, { ...restProps, name: 'star-solid' }, void 0), fillPercentage > 0 && fillPercentage < 100 && (_jsxs(StyledPartialRatingContainer, { children: [_jsx(Icon, { ...restProps, name: 'star' }, void 0), _jsx(StyledPartialRating, { ratingPercentage: fillPercentage, children: _jsx(Icon, { ...restProps, name: 'star-solid' }, void 0) }, void 0)] }, void 0))] }, void 0));
 };
 const Rating = (props) => {
     const starsOutline = [];
@@ -67,7 +67,7 @@ const Rating = (props) => {
         }
         starsOutline.push(_jsx(RatingItem, { fill: fillValue }, `star-${i}`));
     }
-    return (_jsxs(StyledRating, Object.assign({ "aria-label": ariaLabel, tabIndex: tabIndex }, restProps, { children: [_jsx(StyledRatingItemsContainer, { children: starsOutline }, void 0), metaInfo && _jsxs(StyledRatingMetaInfo, { children: ["(", metaInfo, ")"] }, void 0), ' '] }), void 0));
+    return (_jsxs(StyledRating, { "aria-label": ariaLabel, tabIndex: tabIndex, ...restProps, children: [_jsx(StyledRatingItemsContainer, { children: starsOutline }, void 0), metaInfo && _jsxs(StyledRatingMetaInfo, { children: ["(", metaInfo, ")"] }, void 0), ' '] }, void 0));
 };
 Rating.defaultProps = defaultProps;
 export default Rating;