npm - @chayns-components/core - Versions diffs - 5.3.11-alpha.0 → 5.4.0 - Mend

@chayns-components/core 5.3.11-alpha.0 → 5.4.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 (460) hide show

package/lib/esm/components/number-input/NumberInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NumberInput.js","names":["React","useEffect","useRef","useState","NUMBER_CLEAR_REGEX","formateNumber","isValidString","parseFloatWithDecimals","Input","NumberInput","t0","$","_c","isDecimalInput","isMoneyInput","isTimeInput","isInvalid","maxNumber","t1","value","shouldTriggerChangeOnFormat","t2","placeholder","onBlur","isDisabled","onChange","shouldShowOnlyBottomBorder","minNumber","t3","shouldEnableKeyboardHighlighting","undefined","Infinity","plainText","setPlainText","formattedValue","setFormattedValue","hasFocus","setHasFocus","shouldRemainPlaceholder","setShouldRemainPlaceholder","isValueInvalid","setIsValueInvalid","localPlaceholder","initialInputRef","t4","event","newValue","target","current","sanitizedValueString","replace","includes","length","valueToCheck","replaceAll","string","Number","match","onLocalChange","t5","sanitizedValue","newIsInvalid","parsedNumber","stringValue","decimals","newStringValue","number","onLocalBlur","t6","onLocalFocus","t7","t8","parsedNumber_0","t10","t9","t11","t12","t13","createElement","inputMode","displayName"],"sources":["../../../../src/components/number-input/NumberInput.tsx"],"sourcesContent":["import React, { ChangeEventHandler, FC, useEffect, useRef, useState } from 'react';\nimport { NUMBER_CLEAR_REGEX } from '../../constants/numberInput';\nimport { formateNumber, isValidString, parseFloatWithDecimals } from '../../utils/numberInput';\nimport Input from '../input/Input';\n\nexport type NumberInputProps = {\n /*\n Applies rules for decimal input.\n * Enables the user to input one zero as number before the comma\n /\n isDecimalInput?: boolean;\n /\n Whether the input is disabled\n /\n isDisabled?: boolean;\n /\n Whether the value is invalid.\n /\n isInvalid?: boolean;\n /\n Applies rules for money input.\n * Rules: only two decimal places, one zero before the comma\n /\n isMoneyInput?: boolean;\n /\n Whether the value should be formatted as a time.\n /\n isTimeInput?: boolean;\n /\n Limits the number to this value\n /\n maxNumber?: number;\n /\n Limits the number to this value\n /\n minNumber?: number;\n /\n Callback function that is called when the input gets out of focus\n /\n onBlur?: (newNumber: number \| string \| null, isInvalid: boolean) => void;\n /\n Callback function that is called when the input changes\n * It will pass the text from the input\n /\n onChange?: (newValue: string) => void;\n /\n Placeholder for the input field\n /\n placeholder?: string;\n /\n Whether only the bottom border should be displayed\n /\n shouldShowOnlyBottomBorder?: boolean;\n /\n Whether the onChange function should be triggert when the value is formatted on the focus or blur\n /\n shouldTriggerChangeOnFormat?: boolean;\n /\n The value, that should be displayed in the input, when it is in focus.\n * You can also pass a stringified number as default value.\n * NOTE: If you pass a stringified number, it will be formatted to the selected format\n /\n value?: string;\n /\n Enables keyboard-only focus highlighting.\n */\n shouldEnableKeyboardHighlighting?: boolean;\n};\n\nconst NumberInput: FC<NumberInputProps> = ({\n isDecimalInput,\n isMoneyInput,\n isTimeInput,\n isInvalid,\n maxNumber = Infinity,\n value,\n shouldTriggerChangeOnFormat = true,\n placeholder,\n onBlur,\n isDisabled,\n onChange,\n shouldShowOnlyBottomBorder,\n minNumber = -Infinity,\n shouldEnableKeyboardHighlighting,\n}) => {\n 'use memo';\n\n // the plainText will be shown in the input, when it is in focus\n const [plainText, setPlainText] = useState<string>('');\n // the formattedValue will be shown in the input, when it is not in focus\n const [formattedValue, setFormattedValue] = useState<string>('');\n const [hasFocus, setHasFocus] = useState<boolean>(false);\n const [shouldRemainPlaceholder, setShouldRemainPlaceholder] = useState<boolean>(false);\n\n const [isValueInvalid, setIsValueInvalid] = useState(false);\n const localPlaceholder = placeholder ?? (isMoneyInput ? '€' : undefined);\n\n const initialInputRef = useRef(true);\n\n const onLocalChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n const newValue = event.target.value;\n\n initialInputRef.current = false;\n\n const sanitizedValueString = newValue\n // Removes everything except numbers, commas and points\n .replace(NUMBER_CLEAR_REGEX, '');\n\n if (\n isTimeInput &&\n ((sanitizedValueString.includes(':') && sanitizedValueString.length > 5) \|\|\n (!sanitizedValueString.includes(':') && sanitizedValueString.length > 4))\n ) {\n return;\n }\n\n const valueToCheck = sanitizedValueString.replaceAll(',', '.');\n\n if (!isValidString({ string: valueToCheck, isMoneyInput, isDecimalInput, isTimeInput })) {\n return;\n }\n\n if (\n (maxNumber && Number(valueToCheck) > maxNumber) \|\|\n (minNumber && Number(valueToCheck) < minNumber)\n ) {\n return;\n }\n\n if (newValue.length === 1 && newValue.match(/^[0-9]+$/) === null) {\n setShouldRemainPlaceholder(true);\n } else {\n setShouldRemainPlaceholder(false);\n }\n\n setPlainText(sanitizedValueString.replaceAll('.', ','));\n\n if (typeof onChange === 'function') {\n onChange(sanitizedValueString.replaceAll('.', ','));\n }\n };\n\n const onLocalBlur = () => {\n const sanitizedValue = plainText;\n let newIsInvalid = false;\n let parsedNumber = null;\n\n if (!isTimeInput) {\n parsedNumber = parseFloatWithDecimals({\n stringValue: sanitizedValue.replace(',', '.').replaceAll(':', '').replace('€', ''),\n decimals: isMoneyInput ? 2 : undefined,\n });\n\n if (\n parsedNumber &&\n parsedNumber !== 0 &&\n (parsedNumber > maxNumber \|\| parsedNumber < minNumber)\n ) {\n newIsInvalid = true;\n }\n\n setIsValueInvalid(newIsInvalid);\n }\n\n const newStringValue =\n plainText.length === 0\n ? ''\n : formateNumber({\n number: isTimeInput ? sanitizedValue : parsedNumber,\n isMoneyInput,\n isTimeInput,\n });\n\n setFormattedValue(`${newStringValue} ${isMoneyInput ? '€' : ''}`);\n setPlainText(newStringValue.replaceAll('.', ''));\n setHasFocus(false);\n\n if (typeof onChange === 'function' && shouldTriggerChangeOnFormat) {\n onChange(newStringValue.replaceAll('.', ''));\n }\n\n if (typeof onBlur === 'function') {\n if (isTimeInput) {\n onBlur(newStringValue, newIsInvalid);\n } else {\n onBlur(parsedNumber, newIsInvalid);\n }\n }\n };\n\n const onLocalFocus = () => {\n // formattedValue will be a number string with german number format (e.g. 1.000,00)\n // It will remove all dots, so that the user can type in the number\n setPlainText(formattedValue.replaceAll('.', '').replace('€', '').replaceAll(' ', ''));\n\n // This will update the external state\n if (typeof onChange === 'function' && shouldTriggerChangeOnFormat) {\n onChange(formattedValue.replaceAll('.', '').replace('€', '').replaceAll(' ', ''));\n }\n\n setIsValueInvalid(false);\n setHasFocus(true);\n };\n\n // updates the formattedValue, when the value changes\n useEffect(() => {\n let parsedNumber = null;\n\n if (!isTimeInput) {\n parsedNumber = parseFloatWithDecimals({\n stringValue: plainText\n .replace(',', '.')\n .replaceAll(':', '')\n .replace('€', '')\n .replaceAll(' ', ''),\n decimals: isMoneyInput ? 2 : undefined,\n });\n\n // checks, if a given number is invalid, if the input is not in focus\n if (!hasFocus) {\n if (parsedNumber === null && initialInputRef.current) {\n setIsValueInvalid(false);\n } else {\n setIsValueInvalid(\n parsedNumber === null \|\|\n parsedNumber > maxNumber \|\|\n parsedNumber < minNumber,\n );\n }\n }\n }\n\n setFormattedValue(\n plainText.length === 0\n ? ''\n : `${formateNumber({\n number: isTimeInput ? plainText : parsedNumber,\n isMoneyInput,\n isTimeInput,\n })}${isMoneyInput ? ' €' : ''}`,\n );\n }, [hasFocus, isMoneyInput, isTimeInput, maxNumber, minNumber, plainText]);\n\n useEffect(() => {\n if (typeof value === 'string') {\n setPlainText(value.replace('€', '').replaceAll(' ', ''));\n }\n }, [value]);\n\n return (\n <Input\n shouldRemainPlaceholder={shouldRemainPlaceholder}\n shouldShowOnlyBottomBorder={shouldShowOnlyBottomBorder}\n inputMode=\"decimal\"\n onChange={onLocalChange}\n value={hasFocus ? plainText : formattedValue}\n placeholder={localPlaceholder}\n onBlur={onLocalBlur}\n onFocus={onLocalFocus}\n isDisabled={isDisabled}\n isInvalid={typeof isInvalid === 'boolean' ? isInvalid : isValueInvalid}\n shouldShowCenteredContent={shouldShowOnlyBottomBorder}\n shouldEnableKeyboardHighlighting={shouldEnableKeyboardHighlighting}\n />\n );\n};\n\nNumberInput.displayName = 'NumberInput';\n\nexport default NumberInput;\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"file":"NumberInput.js","names":["React","useEffect","useRef","useState","NUMBER_CLEAR_REGEX","formateNumber","isValidString","parseFloatWithDecimals","Input","NumberInput","t0","$","_c","isDecimalInput","isMoneyInput","isTimeInput","isInvalid","maxNumber","t1","value","shouldTriggerChangeOnFormat","t2","placeholder","onBlur","isDisabled","onChange","shouldShowOnlyBottomBorder","minNumber","t3","undefined","Infinity","plainText","setPlainText","formattedValue","setFormattedValue","hasFocus","setHasFocus","shouldRemainPlaceholder","setShouldRemainPlaceholder","isValueInvalid","setIsValueInvalid","localPlaceholder","initialInputRef","t4","event","newValue","target","current","sanitizedValueString","replace","includes","length","valueToCheck","replaceAll","string","Number","match","onLocalChange","t5","sanitizedValue","newIsInvalid","parsedNumber","stringValue","decimals","newStringValue","number","onLocalBlur","t6","onLocalFocus","t7","t8","parsedNumber_0","t10","t9","t11","t12","t13","createElement","inputMode","displayName"],"sources":["../../../../src/components/number-input/NumberInput.tsx"],"sourcesContent":["import React, { ChangeEventHandler, FC, useEffect, useRef, useState } from 'react';\nimport { NUMBER_CLEAR_REGEX } from '../../constants/numberInput';\nimport { formateNumber, isValidString, parseFloatWithDecimals } from '../../utils/numberInput';\nimport Input from '../input/Input';\n\nexport type NumberInputProps = {\n /*\n Applies rules for decimal input.\n * Enables the user to input one zero as number before the comma\n /\n isDecimalInput?: boolean;\n /\n Whether the input is disabled\n /\n isDisabled?: boolean;\n /\n Whether the value is invalid.\n /\n isInvalid?: boolean;\n /\n Applies rules for money input.\n * Rules: only two decimal places, one zero before the comma\n /\n isMoneyInput?: boolean;\n /\n Whether the value should be formatted as a time.\n /\n isTimeInput?: boolean;\n /\n Limits the number to this value\n /\n maxNumber?: number;\n /\n Limits the number to this value\n /\n minNumber?: number;\n /\n Callback function that is called when the input gets out of focus\n /\n onBlur?: (newNumber: number \| string \| null, isInvalid: boolean) => void;\n /\n Callback function that is called when the input changes\n * It will pass the text from the input\n /\n onChange?: (newValue: string) => void;\n /\n Placeholder for the input field\n /\n placeholder?: string;\n /\n Whether only the bottom border should be displayed\n /\n shouldShowOnlyBottomBorder?: boolean;\n /\n Whether the onChange function should be triggert when the value is formatted on the focus or blur\n /\n shouldTriggerChangeOnFormat?: boolean;\n /\n The value, that should be displayed in the input, when it is in focus.\n * You can also pass a stringified number as default value.\n * NOTE: If you pass a stringified number, it will be formatted to the selected format\n */\n value?: string;\n};\n\nconst NumberInput: FC<NumberInputProps> = ({\n isDecimalInput,\n isMoneyInput,\n isTimeInput,\n isInvalid,\n maxNumber = Infinity,\n value,\n shouldTriggerChangeOnFormat = true,\n placeholder,\n onBlur,\n isDisabled,\n onChange,\n shouldShowOnlyBottomBorder,\n minNumber = -Infinity,\n}) => {\n 'use memo';\n\n // the plainText will be shown in the input, when it is in focus\n const [plainText, setPlainText] = useState<string>('');\n // the formattedValue will be shown in the input, when it is not in focus\n const [formattedValue, setFormattedValue] = useState<string>('');\n const [hasFocus, setHasFocus] = useState<boolean>(false);\n const [shouldRemainPlaceholder, setShouldRemainPlaceholder] = useState<boolean>(false);\n\n const [isValueInvalid, setIsValueInvalid] = useState(false);\n const localPlaceholder = placeholder ?? (isMoneyInput ? '€' : undefined);\n\n const initialInputRef = useRef(true);\n\n const onLocalChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n const newValue = event.target.value;\n\n initialInputRef.current = false;\n\n const sanitizedValueString = newValue\n // Removes everything except numbers, commas and points\n .replace(NUMBER_CLEAR_REGEX, '');\n\n if (\n isTimeInput &&\n ((sanitizedValueString.includes(':') && sanitizedValueString.length > 5) \|\|\n (!sanitizedValueString.includes(':') && sanitizedValueString.length > 4))\n ) {\n return;\n }\n\n const valueToCheck = sanitizedValueString.replaceAll(',', '.');\n\n if (!isValidString({ string: valueToCheck, isMoneyInput, isDecimalInput, isTimeInput })) {\n return;\n }\n\n if (\n (maxNumber && Number(valueToCheck) > maxNumber) \|\|\n (minNumber && Number(valueToCheck) < minNumber)\n ) {\n return;\n }\n\n if (newValue.length === 1 && newValue.match(/^[0-9]+$/) === null) {\n setShouldRemainPlaceholder(true);\n } else {\n setShouldRemainPlaceholder(false);\n }\n\n setPlainText(sanitizedValueString.replaceAll('.', ','));\n\n if (typeof onChange === 'function') {\n onChange(sanitizedValueString.replaceAll('.', ','));\n }\n };\n\n const onLocalBlur = () => {\n const sanitizedValue = plainText;\n let newIsInvalid = false;\n let parsedNumber = null;\n\n if (!isTimeInput) {\n parsedNumber = parseFloatWithDecimals({\n stringValue: sanitizedValue.replace(',', '.').replaceAll(':', '').replace('€', ''),\n decimals: isMoneyInput ? 2 : undefined,\n });\n\n if (\n parsedNumber &&\n parsedNumber !== 0 &&\n (parsedNumber > maxNumber \|\| parsedNumber < minNumber)\n ) {\n newIsInvalid = true;\n }\n\n setIsValueInvalid(newIsInvalid);\n }\n\n const newStringValue =\n plainText.length === 0\n ? ''\n : formateNumber({\n number: isTimeInput ? sanitizedValue : parsedNumber,\n isMoneyInput,\n isTimeInput,\n });\n\n setFormattedValue(`${newStringValue} ${isMoneyInput ? '€' : ''}`);\n setPlainText(newStringValue.replaceAll('.', ''));\n setHasFocus(false);\n\n if (typeof onChange === 'function' && shouldTriggerChangeOnFormat) {\n onChange(newStringValue.replaceAll('.', ''));\n }\n\n if (typeof onBlur === 'function') {\n if (isTimeInput) {\n onBlur(newStringValue, newIsInvalid);\n } else {\n onBlur(parsedNumber, newIsInvalid);\n }\n }\n };\n\n const onLocalFocus = () => {\n // formattedValue will be a number string with german number format (e.g. 1.000,00)\n // It will remove all dots, so that the user can type in the number\n setPlainText(formattedValue.replaceAll('.', '').replace('€', '').replaceAll(' ', ''));\n\n // This will update the external state\n if (typeof onChange === 'function' && shouldTriggerChangeOnFormat) {\n onChange(formattedValue.replaceAll('.', '').replace('€', '').replaceAll(' ', ''));\n }\n\n setIsValueInvalid(false);\n setHasFocus(true);\n };\n\n // updates the formattedValue, when the value changes\n useEffect(() => {\n let parsedNumber = null;\n\n if (!isTimeInput) {\n parsedNumber = parseFloatWithDecimals({\n stringValue: plainText\n .replace(',', '.')\n .replaceAll(':', '')\n .replace('€', '')\n .replaceAll(' ', ''),\n decimals: isMoneyInput ? 2 : undefined,\n });\n\n // checks, if a given number is invalid, if the input is not in focus\n if (!hasFocus) {\n if (parsedNumber === null && initialInputRef.current) {\n setIsValueInvalid(false);\n } else {\n setIsValueInvalid(\n parsedNumber === null \|\|\n parsedNumber > maxNumber \|\|\n parsedNumber < minNumber,\n );\n }\n }\n }\n\n setFormattedValue(\n plainText.length === 0\n ? ''\n : `${formateNumber({\n number: isTimeInput ? plainText : parsedNumber,\n isMoneyInput,\n isTimeInput,\n })}${isMoneyInput ? ' €' : ''}`,\n );\n }, [hasFocus, isMoneyInput, isTimeInput, maxNumber, minNumber, plainText]);\n\n useEffect(() => {\n if (typeof value === 'string') {\n setPlainText(value.replace('€', '').replaceAll(' ', ''));\n }\n }, [value]);\n\n return (\n <Input\n shouldRemainPlaceholder={shouldRemainPlaceholder}\n shouldShowOnlyBottomBorder={shouldShowOnlyBottomBorder}\n inputMode=\"decimal\"\n onChange={onLocalChange}\n value={hasFocus ? plainText : formattedValue}\n placeholder={localPlaceholder}\n onBlur={onLocalBlur}\n onFocus={onLocalFocus}\n isDisabled={isDisabled}\n isInvalid={typeof isInvalid === 'boolean' ? isInvalid : isValueInvalid}\n shouldShowCenteredContent={shouldShowOnlyBottomBorder}\n />\n );\n};\n\nNumberInput.displayName = 'NumberInput';\n\nexport default NumberInput;\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/components/page-provider/PageProvider.js CHANGED Viewed

@@ -32,8 +32,7 @@ const PageProvider = ({
   shouldRemovePadding = false,
   shouldUseUsableHeight = false,
   iconColor,
-  customVariables,
-  shouldEnableKeyboardHighlighting
+  customVariables
 }) => {
   const {
     runtimeEnvironment
@@ -56,8 +55,7 @@ const PageProvider = ({
       height: '100%'
     } : style,
     customVariables: customVariables,
-    iconColor: iconColor,
-    shouldEnableKeyboardHighlighting: shouldEnableKeyboardHighlighting
+    iconColor: iconColor
   }, children), /*#__PURE__*/React.createElement(GlobalStyle, null));
 };
 PageProvider.displayName = 'PageProvider';

package/lib/esm/components/page-provider/PageProvider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PageProvider.js","names":["RuntimeEnviroment","useEnvironment","React","createGlobalStyle","useUsableHeight","ColorSchemeProvider","StyledPageProvider","GlobalStyle","PageProvider","children","color","colorMode","secondaryColor","siteId","style","shouldReduceUsableHeightByCoverHeight","shouldRemovePadding","shouldUseUsableHeight","iconColor","customVariables","~~shouldEnableKeyboardHighlighting","~~runtimeEnvironment","usableHeight","shouldReduceByCoverHeight","shouldUsePadding","IntercomPlugin","PagemakerPlugin","includes","createElement","className","$shouldUsePadding","$usableHeight","undefined","height","displayName"],"sources":["../../../../src/components/page-provider/PageProvider.tsx"],"sourcesContent":["import { RuntimeEnviroment, useEnvironment } from 'chayns-api';\nimport React, { FC } from 'react';\nimport { createGlobalStyle } from 'styled-components';\nimport { useUsableHeight } from '../../utils/pageProvider';\nimport ColorSchemeProvider, {\n type ColorSchemeProviderProps,\n} from '../color-scheme-provider/ColorSchemeProvider';\nimport { StyledPageProvider } from './PageProvider.styles';\n\n/*\n Props for the PageProvider component.\n * @description\n * This interface defines the props that can be passed to the PageProvider component\n * for controlling the layout and styling behavior.\n * @example\n * <PageProvider shouldRemovePadding={true}>\n * {children}\n * </PageProvider>\n /\ninterface PageProviderProps extends ColorSchemeProviderProps {\n /\n Controls whether the usable height should be reduced by the cover height\n * @description\n * When true, the usable height will be reduced by the cover image height. This is useful\n * when the page should not be scrollable due to the cover image. The property has no effect\n * when `shouldUseUsableHeight` is false.\n * @default false\n * @optional\n /\n shouldReduceUsableHeightByCoverHeight?: boolean;\n /\n Controls whether padding should be removed from the page\n * @description\n * When true, the padding around the page content will be removed. This is useful when the\n * page should not have any padding, for example, when it is embedded in a pagemaker page.\n * @default false\n * @optional\n /\n shouldRemovePadding?: boolean;\n /\n Controls whether the component should use the calculated usable height\n * @description\n * When true, the page will cover the entire usable height of the screen. This means that\n * the viewport is not scrollable and the page takes up the full height not required by the\n * title or bottom bar. Optionally, the height of the cover image can be reduced by setting\n * `shouldReduceUsableHeightByCoverHeight` to true.\n * @default false\n * @optional\n /\n shouldUseUsableHeight?: boolean;\n}\n\nconst GlobalStyle = createGlobalStyle`\n , ::before, ::after {\n box-sizing: border-box;\n }\n`;\n\nconst PageProvider: FC<PageProviderProps> = ({\n children,\n color,\n colorMode,\n secondaryColor,\n siteId,\n style = {},\n shouldReduceUsableHeightByCoverHeight = false,\n shouldRemovePadding = false,\n shouldUseUsableHeight = false,\n iconColor,\n customVariables,\n ~~shouldEnableKeyboardHighlighting,\n~~}) => {\n const { runtimeEnvironment } = useEnvironment();\n\n const usableHeight = useUsableHeight({\n shouldReduceByCoverHeight: shouldReduceUsableHeightByCoverHeight,\n });\n\n const shouldUsePadding =\n !shouldRemovePadding &&\n ![RuntimeEnviroment.IntercomPlugin, RuntimeEnviroment.PagemakerPlugin, 6].includes(\n runtimeEnvironment as number,\n );\n\n return (\n <StyledPageProvider\n className=\"page-provider\"\n $shouldUsePadding={shouldUsePadding}\n $usableHeight={shouldUseUsableHeight ? usableHeight : undefined}\n >\n <ColorSchemeProvider\n color={color}\n secondaryColor={secondaryColor}\n colorMode={colorMode}\n siteId={siteId}\n style={shouldUseUsableHeight ? { ...style, height: '100%' } : style}\n customVariables={customVariables}\n iconColor={iconColor}\n ~~shouldEnableKeyboardHighlighting={shouldEnableKeyboardHighlighting}\n~~ >\n {children}\n </ColorSchemeProvider>\n <GlobalStyle />\n </StyledPageProvider>\n );\n};\nPageProvider.displayName = 'PageProvider';\n\nexport default PageProvider;\n"],"mappings":"AAAA,SAASA,iBAAiB,EAAEC,cAAc,QAAQ,YAAY;AAC9D,OAAOC,KAAK,MAAc,OAAO;AACjC,SAASC,iBAAiB,QAAQ,mBAAmB;AACrD,SAASC,eAAe,QAAQ,0BAA0B;AAC1D,OAAOC,mBAAmB,MAEnB,8CAA8C;AACrD,SAASC,kBAAkB,QAAQ,uBAAuB;;AAE1D;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAkCA,MAAMC,WAAW,GAAGJ,iBAAiB;AACrC;AACA;AACA;AACA,CAAC;AAED,MAAMK,YAAmC,GAAGA,CAAC;EACzCC,QAAQ;EACRC,KAAK;EACLC,SAAS;EACTC,cAAc;EACdC,MAAM;EACNC,KAAK,GAAG,CAAC,CAAC;EACVC,qCAAqC,GAAG,KAAK;EAC7CC,mBAAmB,GAAG,KAAK;EAC3BC,qBAAqB,GAAG,KAAK;EAC7BC,SAAS;EACTC~~,eAAe~~;~~EACfC;~~AACJ,CAAC,KAAK;EACF,MAAM;IAAEC;EAAmB,CAAC,~~GAAGpB~~,cAAc,CAAC,CAAC;EAE/C,~~MAAMqB~~,YAAY,~~GAAGlB~~,eAAe,CAAC;~~IACjCmB~~,yBAAyB,~~EAAER~~;EAC/B,CAAC,CAAC;EAEF,~~MAAMS~~,gBAAgB,GAClB,~~CAACR~~,mBAAmB,IACpB,CAAC,CAAChB,iBAAiB,~~CAACyB~~,cAAc,~~EAAEzB~~,iBAAiB,~~CAAC0B~~,eAAe,EAAE,CAAC,CAAC,CAACC,QAAQ,CAC9EN,kBACJ,CAAC;EAEL,~~oBACInB~~,KAAA,~~CAAA0B~~,aAAA,~~CAACtB~~,kBAAkB;~~IACfuB~~,SAAS,EAAC,eAAe;IACzBC,iBAAiB,EAAEN,gBAAiB;IACpCO,aAAa,~~EAAEd~~,qBAAqB,~~GAAGK~~,YAAY,GAAGU;EAAU,~~gBAEhE9B~~,KAAA,~~CAAA0B~~,aAAA,~~CAACvB~~,mBAAmB;IAChBK,KAAK,EAAEA,KAAM;IACbE,cAAc,EAAEA,cAAe;IAC/BD,SAAS,EAAEA,SAAU;IACrBE,MAAM,EAAEA,MAAO;IACfC,KAAK,EAAEG,qBAAqB,GAAG;MAAE,GAAGH,KAAK;~~MAAEmB~~,MAAM,EAAE;IAAO,CAAC,~~GAAGnB~~,KAAM;IACpEK,eAAe,EAAEA,eAAgB;IACjCD,SAAS,EAAEA~~,SAAU~~;~~IACrBE~~,~~gCAAgC~~,~~EAAEA;EAAiC,GAElEX,~~QACgB,CAAC,eACtBP,KAAA,~~CAAA0B~~,aAAA,~~CAACrB~~,WAAW,MAAE,CACE,CAAC;AAE7B,CAAC;AACDC,YAAY,~~CAAC0B~~,WAAW,GAAG,cAAc;AAEzC,~~eAAe1B~~,YAAY","ignoreList":[]}
1	+ {"version":3,"file":"PageProvider.js","names":["RuntimeEnviroment","useEnvironment","React","createGlobalStyle","useUsableHeight","ColorSchemeProvider","StyledPageProvider","GlobalStyle","PageProvider","children","color","colorMode","secondaryColor","siteId","style","shouldReduceUsableHeightByCoverHeight","shouldRemovePadding","shouldUseUsableHeight","iconColor","customVariables","runtimeEnvironment","usableHeight","shouldReduceByCoverHeight","shouldUsePadding","IntercomPlugin","PagemakerPlugin","includes","createElement","className","$shouldUsePadding","$usableHeight","undefined","height","displayName"],"sources":["../../../../src/components/page-provider/PageProvider.tsx"],"sourcesContent":["import { RuntimeEnviroment, useEnvironment } from 'chayns-api';\nimport React, { FC } from 'react';\nimport { createGlobalStyle } from 'styled-components';\nimport { useUsableHeight } from '../../utils/pageProvider';\nimport ColorSchemeProvider, {\n type ColorSchemeProviderProps,\n} from '../color-scheme-provider/ColorSchemeProvider';\nimport { StyledPageProvider } from './PageProvider.styles';\n\n/*\n Props for the PageProvider component.\n * @description\n * This interface defines the props that can be passed to the PageProvider component\n * for controlling the layout and styling behavior.\n * @example\n * <PageProvider shouldRemovePadding={true}>\n * {children}\n * </PageProvider>\n /\ninterface PageProviderProps extends ColorSchemeProviderProps {\n /\n Controls whether the usable height should be reduced by the cover height\n * @description\n * When true, the usable height will be reduced by the cover image height. This is useful\n * when the page should not be scrollable due to the cover image. The property has no effect\n * when `shouldUseUsableHeight` is false.\n * @default false\n * @optional\n /\n shouldReduceUsableHeightByCoverHeight?: boolean;\n /\n Controls whether padding should be removed from the page\n * @description\n * When true, the padding around the page content will be removed. This is useful when the\n * page should not have any padding, for example, when it is embedded in a pagemaker page.\n * @default false\n * @optional\n /\n shouldRemovePadding?: boolean;\n /\n Controls whether the component should use the calculated usable height\n * @description\n * When true, the page will cover the entire usable height of the screen. This means that\n * the viewport is not scrollable and the page takes up the full height not required by the\n * title or bottom bar. Optionally, the height of the cover image can be reduced by setting\n * `shouldReduceUsableHeightByCoverHeight` to true.\n * @default false\n * @optional\n /\n shouldUseUsableHeight?: boolean;\n}\n\nconst GlobalStyle = createGlobalStyle`\n , ::before, ::after {\n box-sizing: border-box;\n }\n`;\n\nconst PageProvider: FC<PageProviderProps> = ({\n children,\n color,\n colorMode,\n secondaryColor,\n siteId,\n style = {},\n shouldReduceUsableHeightByCoverHeight = false,\n shouldRemovePadding = false,\n shouldUseUsableHeight = false,\n iconColor,\n customVariables,\n}) => {\n const { runtimeEnvironment } = useEnvironment();\n\n const usableHeight = useUsableHeight({\n shouldReduceByCoverHeight: shouldReduceUsableHeightByCoverHeight,\n });\n\n const shouldUsePadding =\n !shouldRemovePadding &&\n ![RuntimeEnviroment.IntercomPlugin, RuntimeEnviroment.PagemakerPlugin, 6].includes(\n runtimeEnvironment as number,\n );\n\n return (\n <StyledPageProvider\n className=\"page-provider\"\n $shouldUsePadding={shouldUsePadding}\n $usableHeight={shouldUseUsableHeight ? usableHeight : undefined}\n >\n <ColorSchemeProvider\n color={color}\n secondaryColor={secondaryColor}\n colorMode={colorMode}\n siteId={siteId}\n style={shouldUseUsableHeight ? { ...style, height: '100%' } : style}\n customVariables={customVariables}\n iconColor={iconColor}\n >\n {children}\n </ColorSchemeProvider>\n <GlobalStyle />\n </StyledPageProvider>\n );\n};\nPageProvider.displayName = 'PageProvider';\n\nexport default PageProvider;\n"],"mappings":"AAAA,SAASA,iBAAiB,EAAEC,cAAc,QAAQ,YAAY;AAC9D,OAAOC,KAAK,MAAc,OAAO;AACjC,SAASC,iBAAiB,QAAQ,mBAAmB;AACrD,SAASC,eAAe,QAAQ,0BAA0B;AAC1D,OAAOC,mBAAmB,MAEnB,8CAA8C;AACrD,SAASC,kBAAkB,QAAQ,uBAAuB;;AAE1D;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAkCA,MAAMC,WAAW,GAAGJ,iBAAiB;AACrC;AACA;AACA;AACA,CAAC;AAED,MAAMK,YAAmC,GAAGA,CAAC;EACzCC,QAAQ;EACRC,KAAK;EACLC,SAAS;EACTC,cAAc;EACdC,MAAM;EACNC,KAAK,GAAG,CAAC,CAAC;EACVC,qCAAqC,GAAG,KAAK;EAC7CC,mBAAmB,GAAG,KAAK;EAC3BC,qBAAqB,GAAG,KAAK;EAC7BC,SAAS;EACTC;AACJ,CAAC,KAAK;EACF,MAAM;IAAEC;EAAmB,CAAC,GAAGnB,cAAc,CAAC,CAAC;EAE/C,MAAMoB,YAAY,GAAGjB,eAAe,CAAC;IACjCkB,yBAAyB,EAAEP;EAC/B,CAAC,CAAC;EAEF,MAAMQ,gBAAgB,GAClB,CAACP,mBAAmB,IACpB,CAAC,CAAChB,iBAAiB,CAACwB,cAAc,EAAExB,iBAAiB,CAACyB,eAAe,EAAE,CAAC,CAAC,CAACC,QAAQ,CAC9EN,kBACJ,CAAC;EAEL,oBACIlB,KAAA,CAAAyB,aAAA,CAACrB,kBAAkB;IACfsB,SAAS,EAAC,eAAe;IACzBC,iBAAiB,EAAEN,gBAAiB;IACpCO,aAAa,EAAEb,qBAAqB,GAAGI,YAAY,GAAGU;EAAU,gBAEhE7B,KAAA,CAAAyB,aAAA,CAACtB,mBAAmB;IAChBK,KAAK,EAAEA,KAAM;IACbE,cAAc,EAAEA,cAAe;IAC/BD,SAAS,EAAEA,SAAU;IACrBE,MAAM,EAAEA,MAAO;IACfC,KAAK,EAAEG,qBAAqB,GAAG;MAAE,GAAGH,KAAK;MAAEkB,MAAM,EAAE;IAAO,CAAC,GAAGlB,KAAM;IACpEK,eAAe,EAAEA,eAAgB;IACjCD,SAAS,EAAEA;EAAU,GAEpBT,QACgB,CAAC,eACtBP,KAAA,CAAAyB,aAAA,CAACpB,WAAW,MAAE,CACE,CAAC;AAE7B,CAAC;AACDC,YAAY,CAACyB,WAAW,GAAG,cAAc;AAEzC,eAAezB,YAAY","ignoreList":[]}

package/lib/esm/components/popup/Popup.js CHANGED Viewed

@@ -220,11 +220,6 @@ const Popup = /*#__PURE__*/forwardRef(({
       handleHide();
     }
   }, [handleHide]);
-  const handleDocumentKeyDown = useCallback(event => {
-    if (event.key === 'Escape') {
-      handleHide();
-    }
-  }, [handleHide]);
   useImperativeHandle(ref, () => ({
     hide: handleHide,
     show: handleShow
@@ -237,13 +232,11 @@ const Popup = /*#__PURE__*/forwardRef(({
       document.addEventListener('click', handleDocumentClick, true);
       window.addEventListener('blur', handleHide);
     }
-    document.addEventListener('keydown', handleDocumentKeyDown);
     return () => {
       document.removeEventListener('click', handleDocumentClick, true);
       window.removeEventListener('blur', handleHide);
-      document.removeEventListener('keydown', handleDocumentKeyDown);
     };
-  }, [handleDocumentClick, handleDocumentKeyDown, handleHide, isControlled, isPopupOpen, shouldBeOpen]);
+  }, [handleDocumentClick, handleHide, isControlled, isPopupOpen, shouldBeOpen]);
   useEffect(() => {
     if (previousIsVisibleRef.current === isPopupOpen) {
       return;

package/lib/esm/components/popup/Popup.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Popup.js","names":["AnimatePresence","React","forwardRef","useCallback","useEffect","useImperativeHandle","useRef","useState","createPortal","useUuid","PopupAlignment","AreaContextProvider","PopupContentWrapper","StyledPopup","useMeasuredClone","Popup","alignment","content","onShow","container","onHide","children","isOpen","shouldHideOnChildrenLeave","shouldShowOnHover","shouldUseChildrenWidth","shouldScrollWithContent","shouldUseFullWidth","yOffset","shouldBeOpen","ref","coordinates","setCoordinates","x","y","internalAlignment","setInternalAlignment","TopLeft","offset","setOffset","isInternallyOpen","setIsInternallyOpen","portal","setPortal","pseudoSize","setPseudoSize","newContainer","setNewContainer","contentMaxHeight","setContentMaxHeight","undefined","timeout","previousIsVisibleRef","uuid","isControlled","isPopupOpen","height","width","measuredElement","shouldPreventTextWrapping","popupContentRef","popupRef","current","el","element","closest","Element","updatePopupPosition","HORIZONTAL_PADDING","pseudoHeight","pseudoWidth","childrenHeight","left","childrenLeft","top","childrenTop","childrenWidth","getBoundingClientRect","document","body","containerHeight","containerWidth","zoomX","offsetWidth","zoomY","offsetHeight","childrenCenterX","scrollLeft","scrollTop","boundaryLeft","boundaryWidth","relativeX","shouldShowBottom","BottomLeft","BottomRight","BottomCenter","shouldForceRight","TopRight","shouldUseCenterAlignment","TopCenter","hasEnoughSpaceForCenter","isRight","newOffset","right","newX","handleShow","handleReposition","window","addEventListener","removeEventListener","viewHeight","clientHeight","includes","handleChildrenClick","handleHide","handleMouseEnter","clearTimeout","handleMouseLeave","setTimeout","handleDocumentClick","event","contains","target","handleDocumentKeyDown","key","hide","show","createElement","initial","maxHeight","onMouseLeave","onMouseEnter","shouldChangeColor","Fragment","className","onClick","$shouldUseChildrenWidth","$shouldUseFullWidth","displayName"],"sources":["../../../../src/components/popup/Popup.tsx"],"sourcesContent":["import { AnimatePresence } from 'motion/react';\nimport React, {\n forwardRef,\n ReactPortal,\n useCallback,\n useEffect,\n useImperativeHandle,\n useRef,\n useState,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { useUuid } from '../../hooks/uuid';\nimport { PopupAlignment, PopupCoordinates, PopupRef } from '../../types/popup';\nimport AreaContextProvider from '../area-provider/AreaContextProvider';\nimport PopupContentWrapper from './popup-content-wrapper/PopupContentWrapper';\nimport { StyledPopup } from './Popup.styles';\nimport { useMeasuredClone } from '../../hooks/element';\nimport type { PopupProps } from './Popup.types';\n\nexport type { PopupProps } from './Popup.types';\n\nconst Popup = forwardRef<PopupRef, PopupProps>(\n (\n {\n alignment,\n content,\n onShow,\n container,\n onHide,\n children,\n isOpen,\n shouldHideOnChildrenLeave,\n shouldShowOnHover = false,\n shouldUseChildrenWidth = true,\n shouldScrollWithContent = true,\n shouldUseFullWidth = false,\n yOffset = 0,\n shouldBeOpen = false,\n },\n ref,\n ) => {\n const [coordinates, setCoordinates] = useState<PopupCoordinates>({\n x: 0,\n y: 0,\n });\n\n const [internalAlignment, setInternalAlignment] = useState<PopupAlignment>(\n PopupAlignment.TopLeft,\n );\n const [offset, setOffset] = useState<number>(0);\n const [isInternallyOpen, setIsInternallyOpen] = useState(shouldBeOpen);\n const [portal, setPortal] = useState<ReactPortal>();\n const [pseudoSize, setPseudoSize] = useState<{ height: number; width: number }>();\n const [newContainer, setNewContainer] = useState<Element \| null>(container ?? null);\n const [contentMaxHeight, setContentMaxHeight] = useState<number \| undefined>(undefined);\n\n const timeout = useRef<number>();\n const previousIsVisibleRef = useRef(false);\n\n const uuid = useUuid();\n const isControlled = typeof isOpen === 'boolean';\n const isPopupOpen = isControlled ? isOpen : isInternallyOpen;\n\n const { height, width, measuredElement } = useMeasuredClone({\n content,\n shouldPreventTextWrapping: !shouldUseChildrenWidth,\n });\n\n const popupContentRef = useRef<HTMLDivElement>(null);\n const popupRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n if (popupRef.current && !container) {\n const el = popupRef.current as HTMLElement;\n\n const element = el.closest('.dialog-inner, .page-provider, .tapp, body');\n\n setNewContainer(element);\n }\n }, [container]);\n\n useEffect(() => {\n if (container instanceof Element) {\n setNewContainer(container);\n }\n }, [container]);\n\n useEffect(() => {\n setPseudoSize({ height, width });\n }, [height, width]);\n\n const updatePopupPosition = useCallback(() => {\n if (popupRef.current && pseudoSize) {\n if (!newContainer) {\n return;\n }\n\n const HORIZONTAL_PADDING = 23;\n\n const { height: pseudoHeight, width: pseudoWidth } = pseudoSize;\n\n const {\n height: childrenHeight,\n left: childrenLeft,\n top: childrenTop,\n width: childrenWidth,\n } = popupRef.current.getBoundingClientRect();\n\n const element = shouldScrollWithContent ? newContainer : document.body;\n\n const {\n height: containerHeight,\n width: containerWidth,\n top,\n left,\n } = element.getBoundingClientRect();\n\n const zoomX = containerWidth / (element as HTMLElement).offsetWidth;\n const zoomY = containerHeight / (element as HTMLElement).offsetHeight;\n\n const childrenCenterX = childrenLeft + childrenWidth / 2;\n const x = (childrenCenterX - left) / zoomX + element.scrollLeft;\n const y =\n (childrenTop + childrenHeight / 2 - top) / zoomY + element.scrollTop - yOffset;\n\n // Use one coordinate space for all horizontal bounds checks.\n const boundaryLeft = element.scrollLeft;\n const boundaryWidth = containerWidth / zoomX;\n const relativeX = x - boundaryLeft;\n\n const shouldShowBottom =\n pseudoHeight > childrenTop - 25 \|\|\n alignment === PopupAlignment.BottomLeft \|\|\n alignment === PopupAlignment.BottomRight \|\|\n alignment === PopupAlignment.BottomCenter;\n\n const shouldForceRight = shouldShowBottom\n ? alignment === PopupAlignment.BottomRight\n : alignment === PopupAlignment.TopRight;\n\n const shouldUseCenterAlignment = shouldShowBottom\n ? alignment === PopupAlignment.BottomCenter\n : alignment === PopupAlignment.TopCenter;\n\n const hasEnoughSpaceForCenter =\n pseudoWidth / 2 <= relativeX - HORIZONTAL_PADDING &&\n pseudoWidth / 2 <= boundaryWidth - relativeX - HORIZONTAL_PADDING;\n\n if (shouldUseCenterAlignment && hasEnoughSpaceForCenter) {\n setInternalAlignment(\n shouldShowBottom ? PopupAlignment.BottomCenter : PopupAlignment.TopCenter,\n );\n setOffset(0);\n setCoordinates({\n x,\n y,\n });\n } else {\n let isRight = false;\n\n if (pseudoWidth > relativeX - HORIZONTAL_PADDING \|\| shouldForceRight) {\n setInternalAlignment(\n shouldShowBottom ? PopupAlignment.BottomRight : PopupAlignment.TopRight,\n );\n isRight = true;\n } else {\n setInternalAlignment(\n shouldShowBottom ? PopupAlignment.BottomLeft : PopupAlignment.TopLeft,\n );\n }\n\n let newOffset;\n\n if (isRight) {\n newOffset =\n relativeX + pseudoWidth >= boundaryWidth - HORIZONTAL_PADDING\n ? relativeX + pseudoWidth - (boundaryWidth - HORIZONTAL_PADDING)\n : 0;\n } else {\n const right = boundaryWidth - relativeX;\n\n newOffset =\n right + pseudoWidth >= boundaryWidth + HORIZONTAL_PADDING\n ? right + pseudoWidth - (boundaryWidth + HORIZONTAL_PADDING)\n : 0;\n }\n\n setOffset(newOffset);\n\n const newX = x - newOffset;\n\n setCoordinates({\n x: newX,\n y,\n });\n }\n }\n }, [alignment, newContainer, pseudoSize, shouldScrollWithContent, yOffset]);\n\n const handleShow = useCallback(() => {\n updatePopupPosition();\n\n if (isControlled) {\n return;\n }\n\n setIsInternallyOpen(true);\n }, [isControlled, updatePopupPosition]);\n\n useEffect(() => {\n if (isControlled) {\n if (isOpen) {\n updatePopupPosition();\n }\n\n return;\n }\n\n if (shouldBeOpen) {\n handleShow();\n }\n }, [handleShow, isControlled, isOpen, shouldBeOpen, updatePopupPosition]);\n\n const handleReposition = useCallback(() => {\n if (isPopupOpen) {\n updatePopupPosition();\n }\n }, [isPopupOpen, updatePopupPosition]);\n\n useEffect(() => {\n if (!isPopupOpen) {\n return undefined;\n }\n\n window.addEventListener('resize', handleReposition);\n window.addEventListener('scroll', handleReposition, true);\n\n return () => {\n window.removeEventListener('resize', handleReposition);\n window.removeEventListener('scroll', handleReposition, true);\n };\n }, [handleReposition, isPopupOpen]);\n\n useEffect(() => {\n if (!newContainer \|\| !popupRef.current) return;\n\n const viewHeight = newContainer.clientHeight;\n const childrenHeight = popupRef.current.getBoundingClientRect().height;\n\n if (\n [\n PopupAlignment.TopLeft,\n PopupAlignment.TopRight,\n PopupAlignment.TopCenter,\n ].includes(internalAlignment)\n ) {\n setContentMaxHeight(coordinates.y - 20);\n } else {\n setContentMaxHeight(viewHeight - childrenHeight - coordinates.y - 20);\n }\n }, [coordinates.y, internalAlignment, newContainer]);\n\n const handleChildrenClick = () => {\n if (isControlled) {\n return;\n }\n\n handleShow();\n };\n\n const handleHide = useCallback(() => {\n if (isControlled) {\n return;\n }\n\n setIsInternallyOpen(false);\n }, [isControlled]);\n\n const handleMouseEnter = useCallback(() => {\n if (isControlled) {\n return;\n }\n\n if (shouldShowOnHover) {\n window.clearTimeout(timeout.current);\n handleShow();\n }\n }, [handleShow, isControlled, shouldShowOnHover]);\n\n const handleMouseLeave = useCallback(() => {\n if (isControlled) {\n return;\n }\n\n if (!shouldShowOnHover) {\n return;\n }\n\n if (shouldHideOnChildrenLeave) {\n handleHide();\n\n return;\n }\n\n timeout.current = window.setTimeout(() => {\n handleHide();\n }, 500);\n }, [handleHide, isControlled, shouldHideOnChildrenLeave, shouldShowOnHover]);\n\n const handleDocumentClick = useCallback<EventListener>(\n (event) => {\n if (!popupContentRef.current?.contains(event.target as Node)) {\n handleHide();\n }\n },\n [handleHide],\n );\n\n const handleDocumentKeyDown = useCallback(\n (event: KeyboardEvent) => {\n if (event.key === 'Escape') {\n handleHide();\n }\n },\n [handleHide],\n );\n\n useImperativeHandle(\n ref,\n () => ({\n hide: handleHide,\n show: handleShow,\n }),\n [handleHide, handleShow],\n );\n\n useEffect(() => {\n if (!isPopupOpen) {\n return undefined;\n }\n\n if (!isControlled && !shouldBeOpen) {\n document.addEventListener('click', handleDocumentClick, true);\n window.addEventListener('blur', handleHide);\n }\n\n document.addEventListener('keydown', handleDocumentKeyDown);\n\n return () => {\n document.removeEventListener('click', handleDocumentClick, true);\n window.removeEventListener('blur', handleHide);\n document.removeEventListener('keydown', handleDocumentKeyDown);\n };\n }, [\n handleDocumentClick,\n handleDocumentKeyDown,\n handleHide,\n isControlled,\n isPopupOpen,\n shouldBeOpen,\n ]);\n\n useEffect(() => {\n if (previousIsVisibleRef.current === isPopupOpen) {\n return;\n }\n\n previousIsVisibleRef.current = isPopupOpen;\n\n if (isPopupOpen) {\n onShow?.();\n\n return;\n }\n\n onHide?.();\n }, [isPopupOpen, onHide, onShow]);\n\n useEffect(() => {\n if (!newContainer) {\n return;\n }\n\n setPortal(() =>\n createPortal(\n <AnimatePresence initial={false}>\n {isPopupOpen && (\n <PopupContentWrapper\n width={pseudoSize?.width ?? 0}\n offset={offset}\n shouldScrollWithContent={shouldScrollWithContent}\n coordinates={coordinates}\n key={`tooltip_${uuid}`}\n maxHeight={contentMaxHeight}\n alignment={internalAlignment}\n ref={popupContentRef}\n onMouseLeave={handleMouseLeave}\n onMouseEnter={handleMouseEnter}\n >\n <AreaContextProvider shouldChangeColor>\n {content}\n </AreaContextProvider>\n </PopupContentWrapper>\n )}\n </AnimatePresence>,\n newContainer,\n ),\n );\n }, [\n contentMaxHeight,\n internalAlignment,\n newContainer,\n content,\n coordinates,\n handleMouseEnter,\n handleMouseLeave,\n isPopupOpen,\n offset,\n pseudoSize?.width,\n uuid,\n shouldScrollWithContent,\n ]);\n\n return (\n <>\n {measuredElement}\n <StyledPopup\n className=\"beta-chayns-popup\"\n ref={popupRef}\n onClick={handleChildrenClick}\n onMouseLeave={handleMouseLeave}\n onMouseEnter={handleMouseEnter}\n $shouldUseChildrenWidth={shouldUseChildrenWidth}\n $shouldUseFullWidth={shouldUseFullWidth}\n >\n {children}\n </StyledPopup>\n {portal}\n </>\n );\n },\n);\n\nPopup.displayName = 'Popup';\n\nexport default Popup;\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"file":"Popup.js","names":["AnimatePresence","React","forwardRef","useCallback","useEffect","useImperativeHandle","useRef","useState","createPortal","useUuid","PopupAlignment","AreaContextProvider","PopupContentWrapper","StyledPopup","useMeasuredClone","Popup","alignment","content","onShow","container","onHide","children","isOpen","shouldHideOnChildrenLeave","shouldShowOnHover","shouldUseChildrenWidth","shouldScrollWithContent","shouldUseFullWidth","yOffset","shouldBeOpen","ref","coordinates","setCoordinates","x","y","internalAlignment","setInternalAlignment","TopLeft","offset","setOffset","isInternallyOpen","setIsInternallyOpen","portal","setPortal","pseudoSize","setPseudoSize","newContainer","setNewContainer","contentMaxHeight","setContentMaxHeight","undefined","timeout","previousIsVisibleRef","uuid","isControlled","isPopupOpen","height","width","measuredElement","shouldPreventTextWrapping","popupContentRef","popupRef","current","el","element","closest","Element","updatePopupPosition","HORIZONTAL_PADDING","pseudoHeight","pseudoWidth","childrenHeight","left","childrenLeft","top","childrenTop","childrenWidth","getBoundingClientRect","document","body","containerHeight","containerWidth","zoomX","offsetWidth","zoomY","offsetHeight","childrenCenterX","scrollLeft","scrollTop","boundaryLeft","boundaryWidth","relativeX","shouldShowBottom","BottomLeft","BottomRight","BottomCenter","shouldForceRight","TopRight","shouldUseCenterAlignment","TopCenter","hasEnoughSpaceForCenter","isRight","newOffset","right","newX","handleShow","handleReposition","window","addEventListener","removeEventListener","viewHeight","clientHeight","includes","handleChildrenClick","handleHide","handleMouseEnter","clearTimeout","handleMouseLeave","setTimeout","handleDocumentClick","event","contains","target","hide","show","createElement","initial","key","maxHeight","onMouseLeave","onMouseEnter","shouldChangeColor","Fragment","className","onClick","$shouldUseChildrenWidth","$shouldUseFullWidth","displayName"],"sources":["../../../../src/components/popup/Popup.tsx"],"sourcesContent":["import { AnimatePresence } from 'motion/react';\nimport React, {\n forwardRef,\n ReactPortal,\n useCallback,\n useEffect,\n useImperativeHandle,\n useRef,\n useState,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { useUuid } from '../../hooks/uuid';\nimport { PopupAlignment, PopupCoordinates, PopupRef } from '../../types/popup';\nimport AreaContextProvider from '../area-provider/AreaContextProvider';\nimport PopupContentWrapper from './popup-content-wrapper/PopupContentWrapper';\nimport { StyledPopup } from './Popup.styles';\nimport { useMeasuredClone } from '../../hooks/element';\nimport type { PopupProps } from './Popup.types';\n\nexport type { PopupProps } from './Popup.types';\n\nconst Popup = forwardRef<PopupRef, PopupProps>(\n (\n {\n alignment,\n content,\n onShow,\n container,\n onHide,\n children,\n isOpen,\n shouldHideOnChildrenLeave,\n shouldShowOnHover = false,\n shouldUseChildrenWidth = true,\n shouldScrollWithContent = true,\n shouldUseFullWidth = false,\n yOffset = 0,\n shouldBeOpen = false,\n },\n ref,\n ) => {\n const [coordinates, setCoordinates] = useState<PopupCoordinates>({\n x: 0,\n y: 0,\n });\n\n const [internalAlignment, setInternalAlignment] = useState<PopupAlignment>(\n PopupAlignment.TopLeft,\n );\n const [offset, setOffset] = useState<number>(0);\n const [isInternallyOpen, setIsInternallyOpen] = useState(shouldBeOpen);\n const [portal, setPortal] = useState<ReactPortal>();\n const [pseudoSize, setPseudoSize] = useState<{ height: number; width: number }>();\n const [newContainer, setNewContainer] = useState<Element \| null>(container ?? null);\n const [contentMaxHeight, setContentMaxHeight] = useState<number \| undefined>(undefined);\n\n const timeout = useRef<number>();\n const previousIsVisibleRef = useRef(false);\n\n const uuid = useUuid();\n const isControlled = typeof isOpen === 'boolean';\n const isPopupOpen = isControlled ? isOpen : isInternallyOpen;\n\n const { height, width, measuredElement } = useMeasuredClone({\n content,\n shouldPreventTextWrapping: !shouldUseChildrenWidth,\n });\n\n const popupContentRef = useRef<HTMLDivElement>(null);\n const popupRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n if (popupRef.current && !container) {\n const el = popupRef.current as HTMLElement;\n\n const element = el.closest('.dialog-inner, .page-provider, .tapp, body');\n\n setNewContainer(element);\n }\n }, [container]);\n\n useEffect(() => {\n if (container instanceof Element) {\n setNewContainer(container);\n }\n }, [container]);\n\n useEffect(() => {\n setPseudoSize({ height, width });\n }, [height, width]);\n\n const updatePopupPosition = useCallback(() => {\n if (popupRef.current && pseudoSize) {\n if (!newContainer) {\n return;\n }\n\n const HORIZONTAL_PADDING = 23;\n\n const { height: pseudoHeight, width: pseudoWidth } = pseudoSize;\n\n const {\n height: childrenHeight,\n left: childrenLeft,\n top: childrenTop,\n width: childrenWidth,\n } = popupRef.current.getBoundingClientRect();\n\n const element = shouldScrollWithContent ? newContainer : document.body;\n\n const {\n height: containerHeight,\n width: containerWidth,\n top,\n left,\n } = element.getBoundingClientRect();\n\n const zoomX = containerWidth / (element as HTMLElement).offsetWidth;\n const zoomY = containerHeight / (element as HTMLElement).offsetHeight;\n\n const childrenCenterX = childrenLeft + childrenWidth / 2;\n const x = (childrenCenterX - left) / zoomX + element.scrollLeft;\n const y =\n (childrenTop + childrenHeight / 2 - top) / zoomY + element.scrollTop - yOffset;\n\n // Use one coordinate space for all horizontal bounds checks.\n const boundaryLeft = element.scrollLeft;\n const boundaryWidth = containerWidth / zoomX;\n const relativeX = x - boundaryLeft;\n\n const shouldShowBottom =\n pseudoHeight > childrenTop - 25 \|\|\n alignment === PopupAlignment.BottomLeft \|\|\n alignment === PopupAlignment.BottomRight \|\|\n alignment === PopupAlignment.BottomCenter;\n\n const shouldForceRight = shouldShowBottom\n ? alignment === PopupAlignment.BottomRight\n : alignment === PopupAlignment.TopRight;\n\n const shouldUseCenterAlignment = shouldShowBottom\n ? alignment === PopupAlignment.BottomCenter\n : alignment === PopupAlignment.TopCenter;\n\n const hasEnoughSpaceForCenter =\n pseudoWidth / 2 <= relativeX - HORIZONTAL_PADDING &&\n pseudoWidth / 2 <= boundaryWidth - relativeX - HORIZONTAL_PADDING;\n\n if (shouldUseCenterAlignment && hasEnoughSpaceForCenter) {\n setInternalAlignment(\n shouldShowBottom ? PopupAlignment.BottomCenter : PopupAlignment.TopCenter,\n );\n setOffset(0);\n setCoordinates({\n x,\n y,\n });\n } else {\n let isRight = false;\n\n if (pseudoWidth > relativeX - HORIZONTAL_PADDING \|\| shouldForceRight) {\n setInternalAlignment(\n shouldShowBottom ? PopupAlignment.BottomRight : PopupAlignment.TopRight,\n );\n isRight = true;\n } else {\n setInternalAlignment(\n shouldShowBottom ? PopupAlignment.BottomLeft : PopupAlignment.TopLeft,\n );\n }\n\n let newOffset;\n\n if (isRight) {\n newOffset =\n relativeX + pseudoWidth >= boundaryWidth - HORIZONTAL_PADDING\n ? relativeX + pseudoWidth - (boundaryWidth - HORIZONTAL_PADDING)\n : 0;\n } else {\n const right = boundaryWidth - relativeX;\n\n newOffset =\n right + pseudoWidth >= boundaryWidth + HORIZONTAL_PADDING\n ? right + pseudoWidth - (boundaryWidth + HORIZONTAL_PADDING)\n : 0;\n }\n\n setOffset(newOffset);\n\n const newX = x - newOffset;\n\n setCoordinates({\n x: newX,\n y,\n });\n }\n }\n }, [alignment, newContainer, pseudoSize, shouldScrollWithContent, yOffset]);\n\n const handleShow = useCallback(() => {\n updatePopupPosition();\n\n if (isControlled) {\n return;\n }\n\n setIsInternallyOpen(true);\n }, [isControlled, updatePopupPosition]);\n\n useEffect(() => {\n if (isControlled) {\n if (isOpen) {\n updatePopupPosition();\n }\n\n return;\n }\n\n if (shouldBeOpen) {\n handleShow();\n }\n }, [handleShow, isControlled, isOpen, shouldBeOpen, updatePopupPosition]);\n\n const handleReposition = useCallback(() => {\n if (isPopupOpen) {\n updatePopupPosition();\n }\n }, [isPopupOpen, updatePopupPosition]);\n\n useEffect(() => {\n if (!isPopupOpen) {\n return undefined;\n }\n\n window.addEventListener('resize', handleReposition);\n window.addEventListener('scroll', handleReposition, true);\n\n return () => {\n window.removeEventListener('resize', handleReposition);\n window.removeEventListener('scroll', handleReposition, true);\n };\n }, [handleReposition, isPopupOpen]);\n\n useEffect(() => {\n if (!newContainer \|\| !popupRef.current) return;\n\n const viewHeight = newContainer.clientHeight;\n const childrenHeight = popupRef.current.getBoundingClientRect().height;\n\n if (\n [\n PopupAlignment.TopLeft,\n PopupAlignment.TopRight,\n PopupAlignment.TopCenter,\n ].includes(internalAlignment)\n ) {\n setContentMaxHeight(coordinates.y - 20);\n } else {\n setContentMaxHeight(viewHeight - childrenHeight - coordinates.y - 20);\n }\n }, [coordinates.y, internalAlignment, newContainer]);\n\n const handleChildrenClick = () => {\n if (isControlled) {\n return;\n }\n\n handleShow();\n };\n\n const handleHide = useCallback(() => {\n if (isControlled) {\n return;\n }\n\n setIsInternallyOpen(false);\n }, [isControlled]);\n\n const handleMouseEnter = useCallback(() => {\n if (isControlled) {\n return;\n }\n\n if (shouldShowOnHover) {\n window.clearTimeout(timeout.current);\n handleShow();\n }\n }, [handleShow, isControlled, shouldShowOnHover]);\n\n const handleMouseLeave = useCallback(() => {\n if (isControlled) {\n return;\n }\n\n if (!shouldShowOnHover) {\n return;\n }\n\n if (shouldHideOnChildrenLeave) {\n handleHide();\n\n return;\n }\n\n timeout.current = window.setTimeout(() => {\n handleHide();\n }, 500);\n }, [handleHide, isControlled, shouldHideOnChildrenLeave, shouldShowOnHover]);\n\n const handleDocumentClick = useCallback<EventListener>(\n (event) => {\n if (!popupContentRef.current?.contains(event.target as Node)) {\n handleHide();\n }\n },\n [handleHide],\n );\n\n useImperativeHandle(\n ref,\n () => ({\n hide: handleHide,\n show: handleShow,\n }),\n [handleHide, handleShow],\n );\n\n useEffect(() => {\n if (!isPopupOpen) {\n return undefined;\n }\n\n if (!isControlled && !shouldBeOpen) {\n document.addEventListener('click', handleDocumentClick, true);\n window.addEventListener('blur', handleHide);\n }\n\n return () => {\n document.removeEventListener('click', handleDocumentClick, true);\n window.removeEventListener('blur', handleHide);\n };\n }, [handleDocumentClick, handleHide, isControlled, isPopupOpen, shouldBeOpen]);\n\n useEffect(() => {\n if (previousIsVisibleRef.current === isPopupOpen) {\n return;\n }\n\n previousIsVisibleRef.current = isPopupOpen;\n\n if (isPopupOpen) {\n onShow?.();\n\n return;\n }\n\n onHide?.();\n }, [isPopupOpen, onHide, onShow]);\n\n useEffect(() => {\n if (!newContainer) {\n return;\n }\n\n setPortal(() =>\n createPortal(\n <AnimatePresence initial={false}>\n {isPopupOpen && (\n <PopupContentWrapper\n width={pseudoSize?.width ?? 0}\n offset={offset}\n shouldScrollWithContent={shouldScrollWithContent}\n coordinates={coordinates}\n key={`tooltip_${uuid}`}\n maxHeight={contentMaxHeight}\n alignment={internalAlignment}\n ref={popupContentRef}\n onMouseLeave={handleMouseLeave}\n onMouseEnter={handleMouseEnter}\n >\n <AreaContextProvider shouldChangeColor>\n {content}\n </AreaContextProvider>\n </PopupContentWrapper>\n )}\n </AnimatePresence>,\n newContainer,\n ),\n );\n }, [\n contentMaxHeight,\n internalAlignment,\n newContainer,\n content,\n coordinates,\n handleMouseEnter,\n handleMouseLeave,\n isPopupOpen,\n offset,\n pseudoSize?.width,\n uuid,\n shouldScrollWithContent,\n ]);\n\n return (\n <>\n {measuredElement}\n <StyledPopup\n className=\"beta-chayns-popup\"\n ref={popupRef}\n onClick={handleChildrenClick}\n onMouseLeave={handleMouseLeave}\n onMouseEnter={handleMouseEnter}\n $shouldUseChildrenWidth={shouldUseChildrenWidth}\n $shouldUseFullWidth={shouldUseFullWidth}\n >\n {children}\n </StyledPopup>\n {portal}\n </>\n );\n },\n);\n\nPopup.displayName = 'Popup';\n\nexport default Popup;\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/components/radio-button/RadioButton.js CHANGED Viewed

@@ -3,7 +3,6 @@ import React, { useCallback, useContext, useEffect, useMemo, useState, useRef }
 import { RadioButtonGroupContext } from './radio-button-group/RadioButtonGroup';
 import { StyledLabelWrapper, StyledMotionRadioButtonChildren, StyledRadioButton, StyledRadioButtonCheckBox, StyledRadioButtonCheckBoxMark, StyledRadioButtonLabel, StyledRadioButtonPseudoCheckBox, StyledRadioButtonWrapper } from './RadioButton.styles';
 import { getHeightOfSingleTextLine } from '../../utils/calculate';
-import { useKeyboardFocusHighlighting } from '../../hooks/useKeyboardFocusHighlighting';
 const RadioButton = ({
   children,
   shouldShowRightElementOnlyOnChecked = false,
@@ -11,16 +10,14 @@ const RadioButton = ({
   id,
   rightElement,
   shouldShowCentered = true,
-  isDisabled = false,
-  shouldEnableKeyboardHighlighting
+  isDisabled = false
 }) => {
   const {
     selectedRadioButtonId,
     updateSelectedRadioButtonId,
     radioButtonRightElements,
     updateHasRightElement,
-    radioButtonsCanBeUnchecked,
-    shouldEnableKeyboardHighlighting: shouldEnableKeyboardHighlightingFromGroup
+    radioButtonsCanBeUnchecked
   } = useContext(RadioButtonGroupContext);
   const [internalIsChecked, setInternalIsChecked] = useState(false);
   const [isHovered, setIsHovered] = useState(false);
@@ -30,8 +27,6 @@ const RadioButton = ({
   const isInGroup = typeof updateSelectedRadioButtonId === 'function';
   const isMarked = isInGroup ? selectedRadioButtonId === id : internalIsChecked;
   const uncheckable = radioButtonsCanBeUnchecked;
-  const effectiveShouldEnableKeyboardHighlighting = shouldEnableKeyboardHighlightingFromGroup ?? shouldEnableKeyboardHighlighting;
-  const shouldShowKeyboardHighlighting = useKeyboardFocusHighlighting(effectiveShouldEnableKeyboardHighlighting && !isDisabled);
   useEffect(() => {
     if (radioButtonRootRef.current && !shouldShowCentered) {
       const singleLineHeight = getHeightOfSingleTextLine({
@@ -65,12 +60,6 @@ const RadioButton = ({
   const handleMouseLeave = () => {
     setIsHovered(false);
   };
-  const handleKeyDown = useCallback(event => {
-    if (event.key === 'Enter') {
-      event.preventDefault();
-      handleClick();
-    }
-  }, [handleClick]);
   const radioButtonRightElementMargin = useMemo(() => {
     if (!radioButtonRightElements) {
       return 'NONE';
@@ -116,20 +105,8 @@ const RadioButton = ({
     $isDisabled: isDisabled,
     $radioButtonRightElementMargin: radioButtonRightElementMargin
   }, /*#__PURE__*/React.createElement(StyledRadioButtonWrapper, {
-    ref: radioButtonRootRef,
-    $shouldShowKeyboardHighlighting: shouldShowKeyboardHighlighting
-  }, /*#__PURE__*/React.createElement(StyledRadioButtonCheckBox, {
-    onClick: handleClick,
-    onMouseEnter: handleMouseEnter,
-    onMouseLeave: handleMouseLeave,
-    onKeyDown: handleKeyDown,
-    disabled: isDisabled,
-    $isDisabled: isDisabled,
-    $shouldShowKeyboardHighlighting: shouldShowKeyboardHighlighting,
-    type: "radio",
-    checked: isMarked,
-    onChange: () => {}
-  }), /*#__PURE__*/React.createElement(StyledRadioButtonPseudoCheckBox, {
+    ref: radioButtonRootRef
+  }, /*#__PURE__*/React.createElement(StyledRadioButtonPseudoCheckBox, {
     $isDisabled: isDisabled,
     $isChecked: isMarked,
     ref: radioButtonBoxRef,
@@ -144,7 +121,16 @@ const RadioButton = ({
     $isHovered: isHovered,
     $isSelected: isMarked,
     $isDisabled: isDisabled
-  })), /*#__PURE__*/React.createElement(StyledLabelWrapper, null, label && /*#__PURE__*/React.createElement(StyledRadioButtonLabel, {
+  })), /*#__PURE__*/React.createElement(StyledRadioButtonCheckBox, {
+    onClick: handleClick,
+    onMouseEnter: handleMouseEnter,
+    onMouseLeave: handleMouseLeave,
+    disabled: isDisabled,
+    $isDisabled: isDisabled,
+    type: "radio",
+    checked: isMarked,
+    onChange: () => {}
+  }), /*#__PURE__*/React.createElement(StyledLabelWrapper, null, label && /*#__PURE__*/React.createElement(StyledRadioButtonLabel, {
     $isDisabled: isDisabled,
     onClick: handleClick,
     onMouseEnter: handleMouseEnter,
@@ -162,7 +148,7 @@ const RadioButton = ({
     transition: {
       duration: 0.2
     }
-  }, children))), [children, handleClick, handleKeyDown, handleMouseEnter, isDisabled, isHovered, isMarked, label, radioButtonRightElementMargin, radioButtonTop, rightElement, shouldShowCentered, shouldShowKeyboardHighlighting, shouldShowRightElement]);
+  }, children))), [children, handleClick, handleMouseEnter, isDisabled, isHovered, isMarked, label, radioButtonRightElementMargin, radioButtonTop, rightElement, shouldShowCentered, shouldShowRightElement]);
 };
 RadioButton.displayName = 'RadioButton';
 export default RadioButton;

package/lib/esm/components/radio-button/RadioButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RadioButton.js","names":["AnimatePresence","React","useCallback","useContext","useEffect","useMemo","useState","useRef","RadioButtonGroupContext","StyledLabelWrapper","StyledMotionRadioButtonChildren","StyledRadioButton","StyledRadioButtonCheckBox","StyledRadioButtonCheckBoxMark","StyledRadioButtonLabel","StyledRadioButtonPseudoCheckBox","StyledRadioButtonWrapper","getHeightOfSingleTextLine","useKeyboardFocusHighlighting","RadioButton","children","shouldShowRightElementOnlyOnChecked","label","id","rightElement","shouldShowCentered","isDisabled","shouldEnableKeyboardHighlighting","selectedRadioButtonId","updateSelectedRadioButtonId","radioButtonRightElements","updateHasRightElement","radioButtonsCanBeUnchecked","shouldEnableKeyboardHighlightingFromGroup","internalIsChecked","setInternalIsChecked","isHovered","setIsHovered","radioButtonTop","setRadioButtonTop","undefined","radioButtonBoxRef","radioButtonRootRef","isInGroup","isMarked","uncheckable","effectiveShouldEnableKeyboardHighlighting","shouldShowKeyboardHighlighting","current","singleLineHeight","container","boxHeight","getBoundingClientRect","height","handleClick","prev","handleMouseEnter","handleMouseLeave","handleKeyDown","event","key","preventDefault","radioButtonRightElementMargin","index","findIndex","element","prevButton","currentButton","nextButton","hasRightElement","shouldShowRightElement","window","setTimeout","createElement","$isDisabled","$radioButtonRightElementMargin","ref","$shouldShowKeyboardHighlighting","onClick","onMouseEnter","onMouseLeave","onKeyDown","disabled","type","checked","onChange","$isChecked","style","top","transform","$isHovered","$isSelected","initial","animate","opacity","transition","duration","displayName"],"sources":["../../../../src/components/radio-button/RadioButton.tsx"],"sourcesContent":["import { AnimatePresence } from 'motion/react';\nimport React, {\n FC,\n useCallback,\n useContext,\n useEffect,\n useMemo,\n useState,\n type ReactNode,\n useRef,\n} from 'react';\nimport { RadioButtonRightElementMargin } from '../../types/radioButton';\nimport { RadioButtonGroupContext } from './radio-button-group/RadioButtonGroup';\nimport {\n StyledLabelWrapper,\n StyledMotionRadioButtonChildren,\n StyledRadioButton,\n StyledRadioButtonCheckBox,\n StyledRadioButtonCheckBoxMark,\n StyledRadioButtonLabel,\n StyledRadioButtonPseudoCheckBox,\n StyledRadioButtonWrapper,\n} from './RadioButton.styles';\nimport { getHeightOfSingleTextLine } from '../../utils/calculate';\nimport { useKeyboardFocusHighlighting } from '../../hooks/useKeyboardFocusHighlighting';\n\nexport type RadioButtonProps = {\n /*\n The children that should be displayed after the RadioButton is checked.\n /\n children?: ReactNode;\n /\n whether the RadioButton should be shown.\n /\n isDisabled?: boolean;\n /\n The id of the radio button.\n /\n id: string;\n /\n The label that should be displayed next to the radio button.\n /\n label?: ReactNode;\n /\n An element that should be displayed on the right side of the label.\n /\n rightElement?: ReactNode;\n /\n Whether the rightElement should only be displayed when the RadioButton is checked\n /\n shouldShowRightElementOnlyOnChecked?: boolean;\n /\n Whether the RadioButton should be displayed centered to the label or at the top\n /\n shouldShowCentered?: boolean;\n /\n Enables keyboard-only focus highlighting.\n */\n shouldEnableKeyboardHighlighting?: boolean;\n};\n\nconst RadioButton: FC<RadioButtonProps> = ({\n children,\n shouldShowRightElementOnlyOnChecked = false,\n label,\n id,\n rightElement,\n shouldShowCentered = true,\n isDisabled = false,\n shouldEnableKeyboardHighlighting,\n}) => {\n const {\n selectedRadioButtonId,\n updateSelectedRadioButtonId,\n radioButtonRightElements,\n updateHasRightElement,\n radioButtonsCanBeUnchecked,\n shouldEnableKeyboardHighlighting: shouldEnableKeyboardHighlightingFromGroup,\n } = useContext(RadioButtonGroupContext);\n\n const [internalIsChecked, setInternalIsChecked] = useState(false);\n const [isHovered, setIsHovered] = useState(false);\n const [radioButtonTop, setRadioButtonTop] = useState<number \| undefined>(undefined);\n\n const radioButtonBoxRef = useRef<HTMLDivElement>(null);\n const radioButtonRootRef = useRef<HTMLDivElement>(null);\n\n const isInGroup = typeof updateSelectedRadioButtonId === 'function';\n\n const isMarked = isInGroup ? selectedRadioButtonId === id : internalIsChecked;\n\n const uncheckable = radioButtonsCanBeUnchecked;\n\n const effectiveShouldEnableKeyboardHighlighting =\n shouldEnableKeyboardHighlightingFromGroup ?? shouldEnableKeyboardHighlighting;\n\n const shouldShowKeyboardHighlighting = useKeyboardFocusHighlighting(\n effectiveShouldEnableKeyboardHighlighting && !isDisabled,\n );\n\n useEffect(() => {\n if (radioButtonRootRef.current && !shouldShowCentered) {\n const singleLineHeight = getHeightOfSingleTextLine({\n container: radioButtonRootRef.current,\n });\n\n const boxHeight = radioButtonBoxRef.current?.getBoundingClientRect().height ?? 0;\n\n setRadioButtonTop((singleLineHeight - boxHeight) / 2);\n }\n }, [shouldShowCentered]);\n\n const handleClick = useCallback(() => {\n if (isDisabled) {\n return;\n }\n\n if (uncheckable) {\n if (updateSelectedRadioButtonId) {\n updateSelectedRadioButtonId(id === selectedRadioButtonId ? undefined : id);\n }\n setInternalIsChecked((prev) => !prev);\n return;\n }\n if (typeof updateSelectedRadioButtonId === 'function') {\n updateSelectedRadioButtonId(id);\n }\n setInternalIsChecked(true);\n }, [id, isDisabled, uncheckable, selectedRadioButtonId, updateSelectedRadioButtonId]);\n\n const handleMouseEnter = useCallback(() => {\n if (!isDisabled) {\n setIsHovered(true);\n }\n }, [isDisabled]);\n\n const handleMouseLeave = () => {\n setIsHovered(false);\n };\n\n const handleKeyDown = useCallback(\n (event: React.KeyboardEvent<HTMLInputElement>) => {\n if (event.key === 'Enter') {\n event.preventDefault();\n handleClick();\n }\n },\n [handleClick],\n );\n\n const radioButtonRightElementMargin: RadioButtonRightElementMargin = useMemo(() => {\n if (!radioButtonRightElements) {\n return 'NONE';\n }\n\n const index = radioButtonRightElements.findIndex((element) => element.id === id);\n\n if (index < 0) {\n return 'NONE';\n }\n\n const prevButton = radioButtonRightElements[index - 1];\n const currentButton = radioButtonRightElements[index];\n const nextButton = radioButtonRightElements[index + 1];\n\n if (!currentButton?.hasRightElement) {\n return 'NONE';\n }\n\n switch (true) {\n case prevButton?.hasRightElement && !nextButton?.hasRightElement:\n return 'TOP';\n case !prevButton?.hasRightElement && nextButton?.hasRightElement:\n return 'BOTTOM';\n case currentButton?.hasRightElement &&\n !nextButton?.hasRightElement &&\n !prevButton?.hasRightElement:\n return 'NONE';\n default:\n return 'BOTH';\n }\n }, [id, radioButtonRightElements]);\n\n const shouldShowRightElement = useMemo(() => {\n if (rightElement) {\n if (shouldShowRightElementOnlyOnChecked) {\n return isMarked;\n }\n\n return true;\n }\n\n return false;\n }, [isMarked, rightElement, shouldShowRightElementOnlyOnChecked]);\n\n useEffect(() => {\n if (typeof updateHasRightElement === 'function') {\n window.setTimeout(() => {\n updateHasRightElement(id, shouldShowRightElement);\n }, 10);\n }\n }, [id, shouldShowRightElement, updateHasRightElement]);\n\n return useMemo(\n () => (\n <StyledRadioButton\n $isDisabled={isDisabled}\n $radioButtonRightElementMargin={radioButtonRightElementMargin}\n >\n <StyledRadioButtonWrapper\n ref={radioButtonRootRef}\n $shouldShowKeyboardHighlighting={shouldShowKeyboardHighlighting}\n >\n <StyledRadioButtonCheckBox\n onClick={handleClick}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n onKeyDown={handleKeyDown}\n disabled={isDisabled}\n $isDisabled={isDisabled}\n $shouldShowKeyboardHighlighting={shouldShowKeyboardHighlighting}\n type=\"radio\"\n checked={isMarked}\n onChange={() => {}}\n />\n <StyledRadioButtonPseudoCheckBox\n $isDisabled={isDisabled}\n $isChecked={isMarked}\n ref={radioButtonBoxRef}\n onClick={handleClick}\n style={{\n top: shouldShowCentered ? '50%' : radioButtonTop,\n transform: shouldShowCentered ? 'translateY(-50%)' : undefined,\n }}\n >\n <StyledRadioButtonCheckBoxMark\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n $isHovered={isHovered}\n $isSelected={isMarked}\n $isDisabled={isDisabled}\n />\n </StyledRadioButtonPseudoCheckBox>\n <StyledLabelWrapper>\n {label && (\n <StyledRadioButtonLabel\n $isDisabled={isDisabled}\n onClick={handleClick}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n >\n {label}\n </StyledRadioButtonLabel>\n )}\n {shouldShowRightElement && rightElement}\n </StyledLabelWrapper>\n </StyledRadioButtonWrapper>\n {children && (\n <AnimatePresence initial={false}>\n <StyledMotionRadioButtonChildren\n animate={\n isMarked\n ? { opacity: 1, height: 'auto' }\n : { opacity: 0, height: 0 }\n }\n transition={{ duration: 0.2 }}\n >\n {children}\n </StyledMotionRadioButtonChildren>\n </AnimatePresence>\n )}\n </StyledRadioButton>\n ),\n [\n children,\n handleClick,\n handleKeyDown,\n handleMouseEnter,\n isDisabled,\n isHovered,\n isMarked,\n label,\n radioButtonRightElementMargin,\n radioButtonTop,\n rightElement,\n shouldShowCentered,\n shouldShowKeyboardHighlighting,\n shouldShowRightElement,\n ],\n );\n};\n\nRadioButton.displayName = 'RadioButton';\n\nexport default RadioButton;\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"file":"RadioButton.js","names":["AnimatePresence","React","useCallback","useContext","useEffect","useMemo","useState","useRef","RadioButtonGroupContext","StyledLabelWrapper","StyledMotionRadioButtonChildren","StyledRadioButton","StyledRadioButtonCheckBox","StyledRadioButtonCheckBoxMark","StyledRadioButtonLabel","StyledRadioButtonPseudoCheckBox","StyledRadioButtonWrapper","getHeightOfSingleTextLine","RadioButton","children","shouldShowRightElementOnlyOnChecked","label","id","rightElement","shouldShowCentered","isDisabled","selectedRadioButtonId","updateSelectedRadioButtonId","radioButtonRightElements","updateHasRightElement","radioButtonsCanBeUnchecked","internalIsChecked","setInternalIsChecked","isHovered","setIsHovered","radioButtonTop","setRadioButtonTop","undefined","radioButtonBoxRef","radioButtonRootRef","isInGroup","isMarked","uncheckable","current","singleLineHeight","container","boxHeight","getBoundingClientRect","height","handleClick","prev","handleMouseEnter","handleMouseLeave","radioButtonRightElementMargin","index","findIndex","element","prevButton","currentButton","nextButton","hasRightElement","shouldShowRightElement","window","setTimeout","createElement","$isDisabled","$radioButtonRightElementMargin","ref","$isChecked","onClick","style","top","transform","onMouseEnter","onMouseLeave","$isHovered","$isSelected","disabled","type","checked","onChange","initial","animate","opacity","transition","duration","displayName"],"sources":["../../../../src/components/radio-button/RadioButton.tsx"],"sourcesContent":["import { AnimatePresence } from 'motion/react';\nimport React, {\n FC,\n useCallback,\n useContext,\n useEffect,\n useMemo,\n useState,\n type ReactNode,\n useRef,\n} from 'react';\nimport { RadioButtonRightElementMargin } from '../../types/radioButton';\nimport { RadioButtonGroupContext } from './radio-button-group/RadioButtonGroup';\nimport {\n StyledLabelWrapper,\n StyledMotionRadioButtonChildren,\n StyledRadioButton,\n StyledRadioButtonCheckBox,\n StyledRadioButtonCheckBoxMark,\n StyledRadioButtonLabel,\n StyledRadioButtonPseudoCheckBox,\n StyledRadioButtonWrapper,\n} from './RadioButton.styles';\nimport { getHeightOfSingleTextLine } from '../../utils/calculate';\n\nexport type RadioButtonProps = {\n /*\n The children that should be displayed after the RadioButton is checked.\n /\n children?: ReactNode;\n /\n whether the RadioButton should be shown.\n /\n isDisabled?: boolean;\n /\n The id of the radio button.\n /\n id: string;\n /\n The label that should be displayed next to the radio button.\n /\n label?: ReactNode;\n /\n An element that should be displayed on the right side of the label.\n /\n rightElement?: ReactNode;\n /\n Whether the rightElement should only be displayed when the RadioButton is checked\n /\n shouldShowRightElementOnlyOnChecked?: boolean;\n /\n Whether the RadioButton should be displayed centered to the label or at the top\n */\n shouldShowCentered?: boolean;\n};\n\nconst RadioButton: FC<RadioButtonProps> = ({\n children,\n shouldShowRightElementOnlyOnChecked = false,\n label,\n id,\n rightElement,\n shouldShowCentered = true,\n isDisabled = false,\n}) => {\n const {\n selectedRadioButtonId,\n updateSelectedRadioButtonId,\n radioButtonRightElements,\n updateHasRightElement,\n radioButtonsCanBeUnchecked,\n } = useContext(RadioButtonGroupContext);\n\n const [internalIsChecked, setInternalIsChecked] = useState(false);\n const [isHovered, setIsHovered] = useState(false);\n const [radioButtonTop, setRadioButtonTop] = useState<number \| undefined>(undefined);\n\n const radioButtonBoxRef = useRef<HTMLDivElement>(null);\n const radioButtonRootRef = useRef<HTMLDivElement>(null);\n\n const isInGroup = typeof updateSelectedRadioButtonId === 'function';\n\n const isMarked = isInGroup ? selectedRadioButtonId === id : internalIsChecked;\n\n const uncheckable = radioButtonsCanBeUnchecked;\n\n useEffect(() => {\n if (radioButtonRootRef.current && !shouldShowCentered) {\n const singleLineHeight = getHeightOfSingleTextLine({\n container: radioButtonRootRef.current,\n });\n\n const boxHeight = radioButtonBoxRef.current?.getBoundingClientRect().height ?? 0;\n\n setRadioButtonTop((singleLineHeight - boxHeight) / 2);\n }\n }, [shouldShowCentered]);\n\n const handleClick = useCallback(() => {\n if (isDisabled) {\n return;\n }\n\n if (uncheckable) {\n if (updateSelectedRadioButtonId) {\n updateSelectedRadioButtonId(id === selectedRadioButtonId ? undefined : id);\n }\n setInternalIsChecked((prev) => !prev);\n return;\n }\n if (typeof updateSelectedRadioButtonId === 'function') {\n updateSelectedRadioButtonId(id);\n }\n setInternalIsChecked(true);\n }, [id, isDisabled, uncheckable, selectedRadioButtonId, updateSelectedRadioButtonId]);\n\n const handleMouseEnter = useCallback(() => {\n if (!isDisabled) {\n setIsHovered(true);\n }\n }, [isDisabled]);\n\n const handleMouseLeave = () => {\n setIsHovered(false);\n };\n\n const radioButtonRightElementMargin: RadioButtonRightElementMargin = useMemo(() => {\n if (!radioButtonRightElements) {\n return 'NONE';\n }\n\n const index = radioButtonRightElements.findIndex((element) => element.id === id);\n\n if (index < 0) {\n return 'NONE';\n }\n\n const prevButton = radioButtonRightElements[index - 1];\n const currentButton = radioButtonRightElements[index];\n const nextButton = radioButtonRightElements[index + 1];\n\n if (!currentButton?.hasRightElement) {\n return 'NONE';\n }\n\n switch (true) {\n case prevButton?.hasRightElement && !nextButton?.hasRightElement:\n return 'TOP';\n case !prevButton?.hasRightElement && nextButton?.hasRightElement:\n return 'BOTTOM';\n case currentButton?.hasRightElement &&\n !nextButton?.hasRightElement &&\n !prevButton?.hasRightElement:\n return 'NONE';\n default:\n return 'BOTH';\n }\n }, [id, radioButtonRightElements]);\n\n const shouldShowRightElement = useMemo(() => {\n if (rightElement) {\n if (shouldShowRightElementOnlyOnChecked) {\n return isMarked;\n }\n\n return true;\n }\n\n return false;\n }, [isMarked, rightElement, shouldShowRightElementOnlyOnChecked]);\n\n useEffect(() => {\n if (typeof updateHasRightElement === 'function') {\n window.setTimeout(() => {\n updateHasRightElement(id, shouldShowRightElement);\n }, 10);\n }\n }, [id, shouldShowRightElement, updateHasRightElement]);\n\n return useMemo(\n () => (\n <StyledRadioButton\n $isDisabled={isDisabled}\n $radioButtonRightElementMargin={radioButtonRightElementMargin}\n >\n <StyledRadioButtonWrapper ref={radioButtonRootRef}>\n <StyledRadioButtonPseudoCheckBox\n $isDisabled={isDisabled}\n $isChecked={isMarked}\n ref={radioButtonBoxRef}\n onClick={handleClick}\n style={{\n top: shouldShowCentered ? '50%' : radioButtonTop,\n transform: shouldShowCentered ? 'translateY(-50%)' : undefined,\n }}\n >\n <StyledRadioButtonCheckBoxMark\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n $isHovered={isHovered}\n $isSelected={isMarked}\n $isDisabled={isDisabled}\n />\n </StyledRadioButtonPseudoCheckBox>\n <StyledRadioButtonCheckBox\n onClick={handleClick}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n disabled={isDisabled}\n $isDisabled={isDisabled}\n type=\"radio\"\n checked={isMarked}\n onChange={() => {}}\n />\n <StyledLabelWrapper>\n {label && (\n <StyledRadioButtonLabel\n $isDisabled={isDisabled}\n onClick={handleClick}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n >\n {label}\n </StyledRadioButtonLabel>\n )}\n {shouldShowRightElement && rightElement}\n </StyledLabelWrapper>\n </StyledRadioButtonWrapper>\n {children && (\n <AnimatePresence initial={false}>\n <StyledMotionRadioButtonChildren\n animate={\n isMarked\n ? { opacity: 1, height: 'auto' }\n : { opacity: 0, height: 0 }\n }\n transition={{ duration: 0.2 }}\n >\n {children}\n </StyledMotionRadioButtonChildren>\n </AnimatePresence>\n )}\n </StyledRadioButton>\n ),\n [\n children,\n handleClick,\n handleMouseEnter,\n isDisabled,\n isHovered,\n isMarked,\n label,\n radioButtonRightElementMargin,\n radioButtonTop,\n rightElement,\n shouldShowCentered,\n shouldShowRightElement,\n ],\n );\n};\n\nRadioButton.displayName = 'RadioButton';\n\nexport default RadioButton;\n"],"mappings":"AAAA,SAASA,eAAe,QAAQ,cAAc;AAC9C,OAAOC,KAAK,IAERC,WAAW,EACXC,UAAU,EACVC,SAAS,EACTC,OAAO,EACPC,QAAQ,EAERC,MAAM,QACH,OAAO;AAEd,SAASC,uBAAuB,QAAQ,uCAAuC;AAC/E,SACIC,kBAAkB,EAClBC,+BAA+B,EAC/BC,iBAAiB,EACjBC,yBAAyB,EACzBC,6BAA6B,EAC7BC,sBAAsB,EACtBC,+BAA+B,EAC/BC,wBAAwB,QACrB,sBAAsB;AAC7B,SAASC,yBAAyB,QAAQ,uBAAuB;AAiCjE,MAAMC,WAAiC,GAAGA,CAAC;EACvCC,QAAQ;EACRC,mCAAmC,GAAG,KAAK;EAC3CC,KAAK;EACLC,EAAE;EACFC,YAAY;EACZC,kBAAkB,GAAG,IAAI;EACzBC,UAAU,GAAG;AACjB,CAAC,KAAK;EACF,MAAM;IACFC,qBAAqB;IACrBC,2BAA2B;IAC3BC,wBAAwB;IACxBC,qBAAqB;IACrBC;EACJ,CAAC,GAAG3B,UAAU,CAACK,uBAAuB,CAAC;EAEvC,MAAM,CAACuB,iBAAiB,EAAEC,oBAAoB,CAAC,GAAG1B,QAAQ,CAAC,KAAK,CAAC;EACjE,MAAM,CAAC2B,SAAS,EAAEC,YAAY,CAAC,GAAG5B,QAAQ,CAAC,KAAK,CAAC;EACjD,MAAM,CAAC6B,cAAc,EAAEC,iBAAiB,CAAC,GAAG9B,QAAQ,CAAqB+B,SAAS,CAAC;EAEnF,MAAMC,iBAAiB,GAAG/B,MAAM,CAAiB,IAAI,CAAC;EACtD,MAAMgC,kBAAkB,GAAGhC,MAAM,CAAiB,IAAI,CAAC;EAEvD,MAAMiC,SAAS,GAAG,OAAOb,2BAA2B,KAAK,UAAU;EAEnE,MAAMc,QAAQ,GAAGD,SAAS,GAAGd,qBAAqB,KAAKJ,EAAE,GAAGS,iBAAiB;EAE7E,MAAMW,WAAW,GAAGZ,0BAA0B;EAE9C1B,SAAS,CAAC,MAAM;IACZ,IAAImC,kBAAkB,CAACI,OAAO,IAAI,CAACnB,kBAAkB,EAAE;MACnD,MAAMoB,gBAAgB,GAAG3B,yBAAyB,CAAC;QAC/C4B,SAAS,EAAEN,kBAAkB,CAACI;MAClC,CAAC,CAAC;MAEF,MAAMG,SAAS,GAAGR,iBAAiB,CAACK,OAAO,EAAEI,qBAAqB,CAAC,CAAC,CAACC,MAAM,IAAI,CAAC;MAEhFZ,iBAAiB,CAAC,CAACQ,gBAAgB,GAAGE,SAAS,IAAI,CAAC,CAAC;IACzD;EACJ,CAAC,EAAE,CAACtB,kBAAkB,CAAC,CAAC;EAExB,MAAMyB,WAAW,GAAG/C,WAAW,CAAC,MAAM;IAClC,IAAIuB,UAAU,EAAE;MACZ;IACJ;IAEA,IAAIiB,WAAW,EAAE;MACb,IAAIf,2BAA2B,EAAE;QAC7BA,2BAA2B,CAACL,EAAE,KAAKI,qBAAqB,GAAGW,SAAS,GAAGf,EAAE,CAAC;MAC9E;MACAU,oBAAoB,CAAEkB,IAAI,IAAK,CAACA,IAAI,CAAC;MACrC;IACJ;IACA,IAAI,OAAOvB,2BAA2B,KAAK,UAAU,EAAE;MACnDA,2BAA2B,CAACL,EAAE,CAAC;IACnC;IACAU,oBAAoB,CAAC,IAAI,CAAC;EAC9B,CAAC,EAAE,CAACV,EAAE,EAAEG,UAAU,EAAEiB,WAAW,EAAEhB,qBAAqB,EAAEC,2BAA2B,CAAC,CAAC;EAErF,MAAMwB,gBAAgB,GAAGjD,WAAW,CAAC,MAAM;IACvC,IAAI,CAACuB,UAAU,EAAE;MACbS,YAAY,CAAC,IAAI,CAAC;IACtB;EACJ,CAAC,EAAE,CAACT,UAAU,CAAC,CAAC;EAEhB,MAAM2B,gBAAgB,GAAGA,CAAA,KAAM;IAC3BlB,YAAY,CAAC,KAAK,CAAC;EACvB,CAAC;EAED,MAAMmB,6BAA4D,GAAGhD,OAAO,CAAC,MAAM;IAC/E,IAAI,CAACuB,wBAAwB,EAAE;MAC3B,OAAO,MAAM;IACjB;IAEA,MAAM0B,KAAK,GAAG1B,wBAAwB,CAAC2B,SAAS,CAAEC,OAAO,IAAKA,OAAO,CAAClC,EAAE,KAAKA,EAAE,CAAC;IAEhF,IAAIgC,KAAK,GAAG,CAAC,EAAE;MACX,OAAO,MAAM;IACjB;IAEA,MAAMG,UAAU,GAAG7B,wBAAwB,CAAC0B,KAAK,GAAG,CAAC,CAAC;IACtD,MAAMI,aAAa,GAAG9B,wBAAwB,CAAC0B,KAAK,CAAC;IACrD,MAAMK,UAAU,GAAG/B,wBAAwB,CAAC0B,KAAK,GAAG,CAAC,CAAC;IAEtD,IAAI,CAACI,aAAa,EAAEE,eAAe,EAAE;MACjC,OAAO,MAAM;IACjB;IAEA,QAAQ,IAAI;MACR,KAAKH,UAAU,EAAEG,eAAe,IAAI,CAACD,UAAU,EAAEC,eAAe;QAC5D,OAAO,KAAK;MAChB,KAAK,CAACH,UAAU,EAAEG,eAAe,IAAID,UAAU,EAAEC,eAAe;QAC5D,OAAO,QAAQ;MACnB,KAAKF,aAAa,EAAEE,eAAe,IAC/B,CAACD,UAAU,EAAEC,eAAe,IAC5B,CAACH,UAAU,EAAEG,eAAe;QAC5B,OAAO,MAAM;MACjB;QACI,OAAO,MAAM;IACrB;EACJ,CAAC,EAAE,CAACtC,EAAE,EAAEM,wBAAwB,CAAC,CAAC;EAElC,MAAMiC,sBAAsB,GAAGxD,OAAO,CAAC,MAAM;IACzC,IAAIkB,YAAY,EAAE;MACd,IAAIH,mCAAmC,EAAE;QACrC,OAAOqB,QAAQ;MACnB;MAEA,OAAO,IAAI;IACf;IAEA,OAAO,KAAK;EAChB,CAAC,EAAE,CAACA,QAAQ,EAAElB,YAAY,EAAEH,mCAAmC,CAAC,CAAC;EAEjEhB,SAAS,CAAC,MAAM;IACZ,IAAI,OAAOyB,qBAAqB,KAAK,UAAU,EAAE;MAC7CiC,MAAM,CAACC,UAAU,CAAC,MAAM;QACpBlC,qBAAqB,CAACP,EAAE,EAAEuC,sBAAsB,CAAC;MACrD,CAAC,EAAE,EAAE,CAAC;IACV;EACJ,CAAC,EAAE,CAACvC,EAAE,EAAEuC,sBAAsB,EAAEhC,qBAAqB,CAAC,CAAC;EAEvD,OAAOxB,OAAO,CACV,mBACIJ,KAAA,CAAA+D,aAAA,CAACrD,iBAAiB;IACdsD,WAAW,EAAExC,UAAW;IACxByC,8BAA8B,EAAEb;EAA8B,gBAE9DpD,KAAA,CAAA+D,aAAA,CAAChD,wBAAwB;IAACmD,GAAG,EAAE5B;EAAmB,gBAC9CtC,KAAA,CAAA+D,aAAA,CAACjD,+BAA+B;IAC5BkD,WAAW,EAAExC,UAAW;IACxB2C,UAAU,EAAE3B,QAAS;IACrB0B,GAAG,EAAE7B,iBAAkB;IACvB+B,OAAO,EAAEpB,WAAY;IACrBqB,KAAK,EAAE;MACHC,GAAG,EAAE/C,kBAAkB,GAAG,KAAK,GAAGW,cAAc;MAChDqC,SAAS,EAAEhD,kBAAkB,GAAG,kBAAkB,GAAGa;IACzD;EAAE,gBAEFpC,KAAA,CAAA+D,aAAA,CAACnD,6BAA6B;IAC1B4D,YAAY,EAAEtB,gBAAiB;IAC/BuB,YAAY,EAAEtB,gBAAiB;IAC/BuB,UAAU,EAAE1C,SAAU;IACtB2C,WAAW,EAAEnC,QAAS;IACtBwB,WAAW,EAAExC;EAAW,CAC3B,CAC4B,CAAC,eAClCxB,KAAA,CAAA+D,aAAA,CAACpD,yBAAyB;IACtByD,OAAO,EAAEpB,WAAY;IACrBwB,YAAY,EAAEtB,gBAAiB;IAC/BuB,YAAY,EAAEtB,gBAAiB;IAC/ByB,QAAQ,EAAEpD,UAAW;IACrBwC,WAAW,EAAExC,UAAW;IACxBqD,IAAI,EAAC,OAAO;IACZC,OAAO,EAAEtC,QAAS;IAClBuC,QAAQ,EAAEA,CAAA,KAAM,CAAC;EAAE,CACtB,CAAC,eACF/E,KAAA,CAAA+D,aAAA,CAACvD,kBAAkB,QACdY,KAAK,iBACFpB,KAAA,CAAA+D,aAAA,CAAClD,sBAAsB;IACnBmD,WAAW,EAAExC,UAAW;IACxB4C,OAAO,EAAEpB,WAAY;IACrBwB,YAAY,EAAEtB,gBAAiB;IAC/BuB,YAAY,EAAEtB;EAAiB,GAE9B/B,KACmB,CAC3B,EACAwC,sBAAsB,IAAItC,YACX,CACE,CAAC,EAC1BJ,QAAQ,iBACLlB,KAAA,CAAA+D,aAAA,CAAChE,eAAe;IAACiF,OAAO,EAAE;EAAM,gBAC5BhF,KAAA,CAAA+D,aAAA,CAACtD,+BAA+B;IAC5BwE,OAAO,EACHzC,QAAQ,GACF;MAAE0C,OAAO,EAAE,CAAC;MAAEnC,MAAM,EAAE;IAAO,CAAC,GAC9B;MAAEmC,OAAO,EAAE,CAAC;MAAEnC,MAAM,EAAE;IAAE,CACjC;IACDoC,UAAU,EAAE;MAAEC,QAAQ,EAAE;IAAI;EAAE,GAE7BlE,QAC4B,CACpB,CAEN,CACtB,EACD,CACIA,QAAQ,EACR8B,WAAW,EACXE,gBAAgB,EAChB1B,UAAU,EACVQ,SAAS,EACTQ,QAAQ,EACRpB,KAAK,EACLgC,6BAA6B,EAC7BlB,cAAc,EACdZ,YAAY,EACZC,kBAAkB,EAClBqC,sBAAsB,CAE9B,CAAC;AACL,CAAC;AAED3C,WAAW,CAACoE,WAAW,GAAG,aAAa;AAEvC,eAAepE,WAAW","ignoreList":[]}

package/lib/esm/components/radio-button/RadioButton.styles.js CHANGED Viewed

@@ -1,6 +1,5 @@
 import { motion } from 'motion/react';
 import styled, { css } from 'styled-components';
-import { keyboardFocusHighlightingCircleRingCss } from '../../utils/keyboardFocusHighlighting.styles';
 export const StyledRadioButton = styled.span`
     display: flex;
     flex-direction: column;
@@ -42,6 +41,14 @@ export const StyledRadioButtonWrapper = styled.div`
     gap: 5px;
     user-select: none;
 `;
+export const StyledRadioButtonCheckBox = styled.input`
+    opacity: 0;
+    height: 15px;
+    width: 15px;
+    cursor: ${({
+  $isDisabled
+}) => $isDisabled ? 'default !important' : 'pointer !important'};
+`;
 export const StyledRadioButtonPseudoCheckBox = styled.div`
     background-color: ${({
   theme,
@@ -56,27 +63,9 @@ export const StyledRadioButtonPseudoCheckBox = styled.div`
     height: 15px;
     position: absolute;
     border-radius: 100%;
-    z-index: 1;
-    cursor: ${({
-  $isDisabled
-}) => $isDisabled ? 'default !important' : 'pointer !important'};
-`;
-export const StyledRadioButtonCheckBox = styled.input`
-    opacity: 0;
-    height: 15px;
-    width: 15px;
     cursor: ${({
   $isDisabled
 }) => $isDisabled ? 'default !important' : 'pointer !important'};
-    ${({
-  $shouldShowKeyboardHighlighting
-}) => $shouldShowKeyboardHighlighting && css`
-            &:focus-visible + ${StyledRadioButtonPseudoCheckBox} {
-                transition: none;
-                ${keyboardFocusHighlightingCircleRingCss}
-            }
-        `}
 `;
 export const StyledRadioButtonCheckBoxMark = styled.span`
     background-color: transparent;

package/lib/esm/components/radio-button/RadioButton.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RadioButton.styles.js","names":["motion","styled","css","~~keyboardFocusHighlightingCircleRingCss","~~StyledRadioButton","span","$isDisabled","$radioButtonRightElementMargin","StyledRadioButtonWrapper","div","~~StyledRadioButtonPseudoCheckBox~~","~~theme~~","~~$isChecked~~","~~StyledRadioButtonCheckBox~~","~~input","~~$~~shouldShowKeyboardHighlighting~~","StyledRadioButtonCheckBoxMark","$isHovered","$isSelected","StyledRadioButtonLabel","p","text","StyledLabelWrapper","StyledMotionRadioButtonChildren"],"sources":["../../../../src/components/radio-button/RadioButton.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport { RadioButtonRightElementMargin } from '../../types/radioButton';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\~~nimport { keyboardFocusHighlightingCircleRingCss } from '../../utils/keyboardFocusHighlighting.styles';\~~n\ntype StyledRadioButtonProps = WithTheme<{\n $isDisabled: boolean;\n $radioButtonRightElementMargin: RadioButtonRightElementMargin;\n}>;\n\nexport const StyledRadioButton = styled.span<StyledRadioButtonProps>`\n display: flex;\n flex-direction: column;\n\n position: relative;\n\n opacity: ${({ $isDisabled }: StyledRadioButtonProps) => ($isDisabled ? 0.5 : 1)};\n\n ${({ $radioButtonRightElementMargin }: StyledRadioButtonProps) => {\n switch ($radioButtonRightElementMargin) {\n case 'BOTH':\n return css`\n margin: 6px 0;\n `;\n case 'TOP':\n return css`\n margin-top: 6px;\n `;\n case 'BOTTOM':\n return css`\n margin-bottom: 6px;\n `;\n case 'NONE':\n default:\n return css`\n margin: 0;\n `;\n }\n }}\n`;\n\~~ntype StyledRadioButtonWrapperProps = {\n $shouldShowKeyboardHighlighting: boolean;\n};\n\~~nexport const StyledRadioButtonWrapper = styled.div~~<StyledRadioButtonWrapperProps>`\~~n display: flex;\n align-items: center;\n position: relative;\n gap: 5px;\n user-select: none;\n`;\n\ntype StyledRadioButtonPseudoCheckBoxProps = WithTheme<{\n $isChecked: boolean;\n $isDisabled: boolean;\n}>;\n\nexport const StyledRadioButtonPseudoCheckBox = styled.div<StyledRadioButtonPseudoCheckBoxProps>`\n background-color: ${({ theme, $isChecked }: StyledRadioButtonPseudoCheckBoxProps) =>\n $isChecked ? theme['secondary-408'] : theme['secondary-403']};\n opacity: 1;\n border: 1px solid\n rgba(${({ theme }: StyledRadioButtonPseudoCheckBoxProps) => theme['409-rgb']}, 0.5);\n width: 15px;\n height: 15px;\n position: absolute;\n border-radius: 100%;\n ~~z-index: 1;\n~~ cursor: ${({ $isDisabled }: StyledRadioButtonPseudoCheckBoxProps) =>\n $isDisabled ? 'default !important' : 'pointer !important'};\n`;\n\ntype StyledRadioButtonCheckBoxProps = WithTheme<{\n $isDisabled: boolean;\n $shouldShowKeyboardHighlighting: boolean;\n}>;\n\nexport const StyledRadioButtonCheckBox = styled.input<StyledRadioButtonCheckBoxProps>`\n opacity: 0;\n height: 15px;\n width: 15px;\n cursor: ${({ $isDisabled }: StyledRadioButtonCheckBoxProps) =>\n $isDisabled ? 'default !important' : 'pointer !important'};\n\n ${({ $shouldShowKeyboardHighlighting }) =>\n $shouldShowKeyboardHighlighting &&\n css`\n &:focus-visible + ${StyledRadioButtonPseudoCheckBox} {\n transition: none;\n ${keyboardFocusHighlightingCircleRingCss}\n }\n `}\n`;\n\ntype StyledRadioButtonCheckBoxMarkProps = WithTheme<{\n $isHovered: boolean;\n $isSelected: boolean;\n $isDisabled: boolean;\n}>;\n\nexport const StyledRadioButtonCheckBoxMark = styled.span<StyledRadioButtonCheckBoxMarkProps>`\n background-color: transparent;\n position: absolute;\n top: 1px;\n left: 3.925px;\n display: inline-block;\n transform: rotate(35deg);\n height: 9px;\n width: 5px;\n border-bottom: 2px solid white;\n border-right: 2px solid white;\n border-top: transparent;\n border-left: transparent;\n z-index: 2;\n cursor: ${({ $isDisabled }: StyledRadioButtonCheckBoxMarkProps) =>\n $isDisabled ? 'default !important' : 'pointer !important'};\n\n ${({ $isHovered, $isSelected }) => {\n if ($isSelected) {\n return css`\n opacity: 1;\n `;\n }\n\n if ($isHovered) {\n return css`\n opacity: 0.5;\n `;\n }\n\n return css`\n opacity: 0;\n `;\n }}\n`;\n\ntype StyledRadioButtonLabelProps = WithTheme<{ $isDisabled: boolean }>;\n\nexport const StyledRadioButtonLabel = styled.p<StyledRadioButtonLabelProps>`\n color: ${({ theme }: StyledRadioButtonLabelProps) => theme.text};\n margin: 0;\n cursor: ${({ $isDisabled }: StyledRadioButtonLabelProps) =>\n $isDisabled ? 'default !important' : 'pointer !important'};\n`;\n\nexport const StyledLabelWrapper = styled.div`\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: 100%;\n gap: 12px;\n`;\n\ntype StyledMotionRadioButtonChildrenProps = WithTheme<unknown>;\n\nexport const StyledMotionRadioButtonChildren = styled(\n motion.div,\n)<StyledMotionRadioButtonChildrenProps>`\n margin-left: 20px;\n cursor: text;\n overflow: hidden;\n color: ${({ theme }: StyledMotionRadioButtonChildrenProps) => theme.text};\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,cAAc;AACrC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;~~AAG~~/C,~~SAASC,sCAAsC,QAAQ,8CAA8C;AAOrG,~~OAAO,MAAMC,iBAAiB,~~GAAGH~~,MAAM,~~CAACI~~,IAA4B;AACpE;AACA;AACA;AACA;AACA;AACA,eAAe,CAAC;EAAEC;AAAoC,CAAC,KAAMA,WAAW,GAAG,GAAG,GAAG,CAAE;AACnF;AACA,MAAM,CAAC;EAAEC;AAAuD,CAAC,KAAK;EAC9D,QAAQA,8BAA8B;IAClC,KAAK,MAAM;MACP,~~OAAOL~~,GAAG;AAC1B;AACA,iBAAiB;IACL,KAAK,KAAK;MACN,OAAOA,GAAG;AAC1B;AACA,iBAAiB;IACL,KAAK,QAAQ;MACT,OAAOA,GAAG;AAC1B;AACA,iBAAiB;IACL,KAAK,MAAM;IACX;MACI,OAAOA,GAAG;AAC1B;AACA,iBAAiB;EACT;AACJ,CAAC;AACL,CAAC;~~AAMD~~,OAAO,~~MAAMM~~,wBAAwB,~~GAAGP~~,MAAM,~~CAACQ~~,~~GAAkC~~;~~AACjF~~;AACA;AACA;AACA;AACA;AACA,CAAC;AAOD,OAAO,~~MAAMC~~,+BAA+B,~~GAAGT~~,MAAM,~~CAACQ~~,GAAyC;AAC/F,wBAAwB,CAAC;~~EAAEE~~,KAAK;EAAEC;AAAiD,CAAC,KAC5EA,UAAU,GAAGD,KAAK,CAAC,eAAe,CAAC,GAAGA,KAAK,CAAC,eAAe,CAAC;AACpE;AACA;AACA,eAAe,CAAC;EAAEA;AAA4C,CAAC,KAAKA,KAAK,CAAC,SAAS,CAAC;AACpF;AACA;AACA;AACA;AACA~~;AACA~~,cAAc,CAAC;~~EAAEL~~;AAAkD,CAAC,KAC5DA,WAAW,GAAG,oBAAoB,GAAG,oBAAoB;AACjE,CAAC;AAOD,OAAO,MAAMO,yBAAyB,GAAGZ,MAAM,CAACa,KAAqC;AACrF;AACA;AACA;AACA,cAAc,CAAC;EAAER;AAA4C,CAAC,KACtDA,WAAW,GAAG,oBAAoB,GAAG,oBAAoB;AACjE;AACA,MAAM,CAAC;EAAES;AAAgC,CAAC,KAClCA,+BAA+B,IAC/Bb,GAAG;AACX,gCAAgCQ,+BAA+B;AAC/D;AACA,kBAAkBP,sCAAsC;AACxD;AACA,SAAS;AACT,CAAC;AAQD,OAAO,~~MAAMa~~,6BAA6B,~~GAAGf~~,MAAM,~~CAACI~~,IAAwC;AAC5F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,cAAc,CAAC;EAAEC;AAAgD,CAAC,KAC1DA,WAAW,GAAG,oBAAoB,GAAG,oBAAoB;AACjE;AACA,MAAM,CAAC;~~EAAEW~~,UAAU;EAAEC;AAAY,CAAC,KAAK;EAC/B,IAAIA,WAAW,EAAE;IACb,~~OAAOhB~~,GAAG;AACtB;AACA,aAAa;EACL;EAEA,~~IAAIe~~,UAAU,EAAE;IACZ,~~OAAOf~~,GAAG;AACtB;AACA,aAAa;EACL;EAEA,OAAOA,GAAG;AAClB;AACA,SAAS;AACL,CAAC;AACL,CAAC;AAID,OAAO,~~MAAMiB~~,sBAAsB,~~GAAGlB~~,MAAM,~~CAACmB~~,CAA8B;AAC3E,aAAa,CAAC;~~EAAET~~;AAAmC,CAAC,KAAKA,KAAK,~~CAACU~~,IAAI;AACnE;AACA,cAAc,CAAC;~~EAAEf~~;AAAyC,CAAC,KACnDA,WAAW,GAAG,oBAAoB,GAAG,oBAAoB;AACjE,CAAC;AAED,OAAO,~~MAAMgB~~,kBAAkB,~~GAAGrB~~,MAAM,~~CAACQ~~,GAAG;AAC5C;AACA;AACA;AACA;AACA;AACA,CAAC;AAID,OAAO,~~MAAMc~~,+BAA+B,~~GAAGtB~~,MAAM,CACjDD,MAAM,~~CAACS~~,GACX,CAAuC;AACvC;AACA;AACA;AACA,aAAa,CAAC;~~EAAEE~~;AAA4C,CAAC,KAAKA,KAAK,~~CAACU~~,IAAI;AAC5E,CAAC","ignoreList":[]}
1	+ {"version":3,"file":"RadioButton.styles.js","names":["motion","styled","css","StyledRadioButton","span","$isDisabled","$radioButtonRightElementMargin","StyledRadioButtonWrapper","div","StyledRadioButtonCheckBox","input","StyledRadioButtonPseudoCheckBox","theme","$isChecked","StyledRadioButtonCheckBoxMark","$isHovered","$isSelected","StyledRadioButtonLabel","p","text","StyledLabelWrapper","StyledMotionRadioButtonChildren"],"sources":["../../../../src/components/radio-button/RadioButton.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled, { css } from 'styled-components';\nimport { RadioButtonRightElementMargin } from '../../types/radioButton';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledRadioButtonProps = WithTheme<{\n $isDisabled: boolean;\n $radioButtonRightElementMargin: RadioButtonRightElementMargin;\n}>;\n\nexport const StyledRadioButton = styled.span<StyledRadioButtonProps>`\n display: flex;\n flex-direction: column;\n\n position: relative;\n\n opacity: ${({ $isDisabled }: StyledRadioButtonProps) => ($isDisabled ? 0.5 : 1)};\n\n ${({ $radioButtonRightElementMargin }: StyledRadioButtonProps) => {\n switch ($radioButtonRightElementMargin) {\n case 'BOTH':\n return css`\n margin: 6px 0;\n `;\n case 'TOP':\n return css`\n margin-top: 6px;\n `;\n case 'BOTTOM':\n return css`\n margin-bottom: 6px;\n `;\n case 'NONE':\n default:\n return css`\n margin: 0;\n `;\n }\n }}\n`;\n\nexport const StyledRadioButtonWrapper = styled.div`\n display: flex;\n align-items: center;\n position: relative;\n gap: 5px;\n user-select: none;\n`;\n\ntype StyledRadioButtonCheckBoxProps = WithTheme<{ $isDisabled: boolean }>;\n\nexport const StyledRadioButtonCheckBox = styled.input<StyledRadioButtonCheckBoxProps>`\n opacity: 0;\n height: 15px;\n width: 15px;\n cursor: ${({ $isDisabled }: StyledRadioButtonCheckBoxProps) =>\n $isDisabled ? 'default !important' : 'pointer !important'};\n`;\n\ntype StyledRadioButtonPseudoCheckBoxProps = WithTheme<{\n $isChecked: boolean;\n $isDisabled: boolean;\n}>;\n\nexport const StyledRadioButtonPseudoCheckBox = styled.div<StyledRadioButtonPseudoCheckBoxProps>`\n background-color: ${({ theme, $isChecked }: StyledRadioButtonPseudoCheckBoxProps) =>\n $isChecked ? theme['secondary-408'] : theme['secondary-403']};\n opacity: 1;\n border: 1px solid\n rgba(${({ theme }: StyledRadioButtonPseudoCheckBoxProps) => theme['409-rgb']}, 0.5);\n width: 15px;\n height: 15px;\n position: absolute;\n border-radius: 100%;\n cursor: ${({ $isDisabled }: StyledRadioButtonPseudoCheckBoxProps) =>\n $isDisabled ? 'default !important' : 'pointer !important'};\n`;\n\ntype StyledRadioButtonCheckBoxMarkProps = WithTheme<{\n $isHovered: boolean;\n $isSelected: boolean;\n $isDisabled: boolean;\n}>;\n\nexport const StyledRadioButtonCheckBoxMark = styled.span<StyledRadioButtonCheckBoxMarkProps>`\n background-color: transparent;\n position: absolute;\n top: 1px;\n left: 3.925px;\n display: inline-block;\n transform: rotate(35deg);\n height: 9px;\n width: 5px;\n border-bottom: 2px solid white;\n border-right: 2px solid white;\n border-top: transparent;\n border-left: transparent;\n z-index: 2;\n cursor: ${({ $isDisabled }: StyledRadioButtonCheckBoxMarkProps) =>\n $isDisabled ? 'default !important' : 'pointer !important'};\n\n ${({ $isHovered, $isSelected }) => {\n if ($isSelected) {\n return css`\n opacity: 1;\n `;\n }\n\n if ($isHovered) {\n return css`\n opacity: 0.5;\n `;\n }\n\n return css`\n opacity: 0;\n `;\n }}\n`;\n\ntype StyledRadioButtonLabelProps = WithTheme<{ $isDisabled: boolean }>;\n\nexport const StyledRadioButtonLabel = styled.p<StyledRadioButtonLabelProps>`\n color: ${({ theme }: StyledRadioButtonLabelProps) => theme.text};\n margin: 0;\n cursor: ${({ $isDisabled }: StyledRadioButtonLabelProps) =>\n $isDisabled ? 'default !important' : 'pointer !important'};\n`;\n\nexport const StyledLabelWrapper = styled.div`\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: 100%;\n gap: 12px;\n`;\n\ntype StyledMotionRadioButtonChildrenProps = WithTheme<unknown>;\n\nexport const StyledMotionRadioButtonChildren = styled(\n motion.div,\n)<StyledMotionRadioButtonChildrenProps>`\n margin-left: 20px;\n cursor: text;\n overflow: hidden;\n color: ${({ theme }: StyledMotionRadioButtonChildrenProps) => theme.text};\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,cAAc;AACrC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAS/C,OAAO,MAAMC,iBAAiB,GAAGF,MAAM,CAACG,IAA4B;AACpE;AACA;AACA;AACA;AACA;AACA,eAAe,CAAC;EAAEC;AAAoC,CAAC,KAAMA,WAAW,GAAG,GAAG,GAAG,CAAE;AACnF;AACA,MAAM,CAAC;EAAEC;AAAuD,CAAC,KAAK;EAC9D,QAAQA,8BAA8B;IAClC,KAAK,MAAM;MACP,OAAOJ,GAAG;AAC1B;AACA,iBAAiB;IACL,KAAK,KAAK;MACN,OAAOA,GAAG;AAC1B;AACA,iBAAiB;IACL,KAAK,QAAQ;MACT,OAAOA,GAAG;AAC1B;AACA,iBAAiB;IACL,KAAK,MAAM;IACX;MACI,OAAOA,GAAG;AAC1B;AACA,iBAAiB;EACT;AACJ,CAAC;AACL,CAAC;AAED,OAAO,MAAMK,wBAAwB,GAAGN,MAAM,CAACO,GAAG;AAClD;AACA;AACA;AACA;AACA;AACA,CAAC;AAID,OAAO,MAAMC,yBAAyB,GAAGR,MAAM,CAACS,KAAqC;AACrF;AACA;AACA;AACA,cAAc,CAAC;EAAEL;AAA4C,CAAC,KACtDA,WAAW,GAAG,oBAAoB,GAAG,oBAAoB;AACjE,CAAC;AAOD,OAAO,MAAMM,+BAA+B,GAAGV,MAAM,CAACO,GAAyC;AAC/F,wBAAwB,CAAC;EAAEI,KAAK;EAAEC;AAAiD,CAAC,KAC5EA,UAAU,GAAGD,KAAK,CAAC,eAAe,CAAC,GAAGA,KAAK,CAAC,eAAe,CAAC;AACpE;AACA;AACA,eAAe,CAAC;EAAEA;AAA4C,CAAC,KAAKA,KAAK,CAAC,SAAS,CAAC;AACpF;AACA;AACA;AACA;AACA,cAAc,CAAC;EAAEP;AAAkD,CAAC,KAC5DA,WAAW,GAAG,oBAAoB,GAAG,oBAAoB;AACjE,CAAC;AAQD,OAAO,MAAMS,6BAA6B,GAAGb,MAAM,CAACG,IAAwC;AAC5F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,cAAc,CAAC;EAAEC;AAAgD,CAAC,KAC1DA,WAAW,GAAG,oBAAoB,GAAG,oBAAoB;AACjE;AACA,MAAM,CAAC;EAAEU,UAAU;EAAEC;AAAY,CAAC,KAAK;EAC/B,IAAIA,WAAW,EAAE;IACb,OAAOd,GAAG;AACtB;AACA,aAAa;EACL;EAEA,IAAIa,UAAU,EAAE;IACZ,OAAOb,GAAG;AACtB;AACA,aAAa;EACL;EAEA,OAAOA,GAAG;AAClB;AACA,SAAS;AACL,CAAC;AACL,CAAC;AAID,OAAO,MAAMe,sBAAsB,GAAGhB,MAAM,CAACiB,CAA8B;AAC3E,aAAa,CAAC;EAAEN;AAAmC,CAAC,KAAKA,KAAK,CAACO,IAAI;AACnE;AACA,cAAc,CAAC;EAAEd;AAAyC,CAAC,KACnDA,WAAW,GAAG,oBAAoB,GAAG,oBAAoB;AACjE,CAAC;AAED,OAAO,MAAMe,kBAAkB,GAAGnB,MAAM,CAACO,GAAG;AAC5C;AACA;AACA;AACA;AACA;AACA,CAAC;AAID,OAAO,MAAMa,+BAA+B,GAAGpB,MAAM,CACjDD,MAAM,CAACQ,GACX,CAAuC;AACvC;AACA;AACA;AACA,aAAa,CAAC;EAAEI;AAA4C,CAAC,KAAKA,KAAK,CAACO,IAAI;AAC5E,CAAC","ignoreList":[]}