@salutejs/plasma-new-hope 0.326.0-canary.1986.15333724841.0 → 0.326.0-canary.1986.15390157539.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.
- package/cjs/components/Combobox/ComboboxNew/FloatingPopover.js +1 -1
- package/cjs/components/Combobox/ComboboxNew/FloatingPopover.js.map +1 -1
- package/cjs/components/Dropdown/FloatingPopover.js +1 -1
- package/cjs/components/Dropdown/FloatingPopover.js.map +1 -1
- package/cjs/components/Select/FloatingPopover.js +1 -1
- package/cjs/components/Select/FloatingPopover.js.map +1 -1
- package/emotion/cjs/components/Combobox/ComboboxNew/FloatingPopover.js +1 -1
- package/emotion/cjs/components/Dropdown/FloatingPopover.js +1 -1
- package/emotion/cjs/components/Select/FloatingPopover.js +1 -1
- package/emotion/es/components/Combobox/ComboboxNew/FloatingPopover.js +1 -1
- package/emotion/es/components/Dropdown/FloatingPopover.js +1 -1
- package/emotion/es/components/Select/FloatingPopover.js +1 -1
- package/es/components/Combobox/ComboboxNew/FloatingPopover.js +1 -1
- package/es/components/Combobox/ComboboxNew/FloatingPopover.js.map +1 -1
- package/es/components/Dropdown/FloatingPopover.js +1 -1
- package/es/components/Dropdown/FloatingPopover.js.map +1 -1
- package/es/components/Select/FloatingPopover.js +1 -1
- package/es/components/Select/FloatingPopover.js.map +1 -1
- package/package.json +2 -2
- package/styled-components/cjs/components/Combobox/ComboboxNew/FloatingPopover.js +1 -1
- package/styled-components/cjs/components/Dropdown/FloatingPopover.js +1 -1
- package/styled-components/cjs/components/Select/FloatingPopover.js +1 -1
- package/styled-components/es/components/Combobox/ComboboxNew/FloatingPopover.js +1 -1
- package/styled-components/es/components/Dropdown/FloatingPopover.js +1 -1
- package/styled-components/es/components/Select/FloatingPopover.js +1 -1
- package/types/components/Combobox/ComboboxNew/FloatingPopover.d.ts.map +1 -1
- package/types/components/Select/FloatingPopover.d.ts.map +1 -1
@@ -34,7 +34,7 @@ var FloatingPopover = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
34
34
|
placement: placement,
|
35
35
|
open: opened,
|
36
36
|
middleware: [react.offset({
|
37
|
-
mainAxis: isInner ?
|
37
|
+
mainAxis: isInner ? LIST_PADDING * 2 : 0,
|
38
38
|
alignmentAxis: isInner ? -LIST_PADDING : 0
|
39
39
|
}), react.flip({
|
40
40
|
fallbackAxisSideDirection: 'end'
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"FloatingPopover.js","sources":["../../../../src/components/Combobox/ComboboxNew/FloatingPopover.tsx"],"sourcesContent":["import {\n flip,\n shift,\n size,\n useFloating,\n FloatingPortal,\n offset as offsetMiddleware,\n autoUpdate,\n} from '@floating-ui/react';\nimport React, { forwardRef } from 'react';\nimport { safeUseId } from '@salutejs/plasma-core';\n\nimport type { FloatingPopoverProps } from './Combobox.types';\n\n// TODO: #2003\nconst LIST_PADDING = 2;\n\nconst FloatingPopover = forwardRef<HTMLDivElement, FloatingPopoverProps>(\n ({ target, children, opened, onToggle, placement, portal, listWidth, zIndex, isInner }, ref) => {\n const { refs, floatingStyles } = useFloating({\n whileElementsMounted(referenceEl, floatingEl, update) {\n return autoUpdate(referenceEl, floatingEl, update, {\n ancestorScroll: false,\n ancestorResize: false,\n layoutShift: false,\n });\n },\n placement,\n open: opened,\n middleware: [\n offsetMiddleware({
|
1
|
+
{"version":3,"file":"FloatingPopover.js","sources":["../../../../src/components/Combobox/ComboboxNew/FloatingPopover.tsx"],"sourcesContent":["import {\n flip,\n shift,\n size,\n useFloating,\n FloatingPortal,\n offset as offsetMiddleware,\n autoUpdate,\n} from '@floating-ui/react';\nimport React, { forwardRef } from 'react';\nimport { safeUseId } from '@salutejs/plasma-core';\n\nimport type { FloatingPopoverProps } from './Combobox.types';\n\n// TODO: #2003\nconst LIST_PADDING = 2;\n\nconst FloatingPopover = forwardRef<HTMLDivElement, FloatingPopoverProps>(\n ({ target, children, opened, onToggle, placement, portal, listWidth, zIndex, isInner }, ref) => {\n const { refs, floatingStyles } = useFloating({\n whileElementsMounted(referenceEl, floatingEl, update) {\n return autoUpdate(referenceEl, floatingEl, update, {\n ancestorScroll: false,\n ancestorResize: false,\n layoutShift: false,\n });\n },\n placement,\n open: opened,\n middleware: [\n offsetMiddleware({\n mainAxis: isInner ? LIST_PADDING * 2 : 0,\n alignmentAxis: isInner ? -LIST_PADDING : 0,\n }),\n flip({ fallbackAxisSideDirection: 'end' }),\n shift(),\n size({\n apply({ rects, elements }) {\n Object.assign(elements.floating.style, {\n width:\n listWidth ||\n `${isInner ? rects.reference.width + LIST_PADDING * 2 : rects.reference.width}px`,\n });\n },\n }),\n ],\n });\n\n const wrappedId = safeUseId();\n\n const handleClick = () => {\n if (onToggle) {\n onToggle(!opened);\n }\n };\n\n // Проверка на target. Это может быть как ReactNode, так и функция, в которую пробрасывается ref.\n // Это нужно для более тонкой настройки reference-элемента, вокруг которого и будет позиционироваться выпадашка.\n // Пример: когда в Textfield под инпутом находится helperText (или еще что-либо),\n // но выпадающий список должен позиционироваться непосредственно возле самого инпута.\n const isTargetAsFunction = typeof target === 'function';\n\n return (\n <div ref={ref} id={wrappedId} style={{ position: 'relative' }}>\n <div ref={isTargetAsFunction ? undefined : refs.setReference} onClick={handleClick}>\n {typeof target === 'function' ? target(refs.setReference as any) : target}\n </div>\n\n {opened && (\n // root - принимает ref контейнера портала.\n // id - если есть портал - не используется, если портала нет - подставляется 'wrappedId'.\n <FloatingPortal {...getFloatingPortalProps(portal, wrappedId)}>\n <div ref={refs.setFloating} style={{ ...floatingStyles, zIndex: zIndex || 1000 }}>\n {children}\n </div>\n </FloatingPortal>\n )}\n </div>\n );\n },\n);\n\ntype FloatingPortalReturnedProps = {\n root?: React.RefObject<HTMLElement>;\n id?: string;\n};\n\n// root - принимает ref контейнера портала.\n// id - если есть портал - не используется, если портала нет - подставляется 'wrappedId'.\nconst getFloatingPortalProps = (\n portal: FloatingPopoverProps['portal'],\n wrappedId: string,\n): FloatingPortalReturnedProps => {\n if (!portal) {\n return { id: wrappedId };\n }\n\n if (typeof portal === 'string') {\n return { id: portal };\n }\n\n return { root: portal };\n};\n\nexport { FloatingPopover };\n"],"names":["LIST_PADDING","FloatingPopover","forwardRef","_ref","ref","target","children","opened","onToggle","placement","portal","listWidth","zIndex","isInner","_useFloating","useFloating","whileElementsMounted","referenceEl","floatingEl","update","autoUpdate","ancestorScroll","ancestorResize","layoutShift","open","middleware","offsetMiddleware","mainAxis","alignmentAxis","flip","fallbackAxisSideDirection","shift","size","apply","_ref2","rects","elements","Object","assign","floating","style","width","concat","reference","refs","floatingStyles","wrappedId","safeUseId","handleClick","isTargetAsFunction","React","createElement","id","position","undefined","setReference","onClick","FloatingPortal","getFloatingPortalProps","setFloating","_objectSpread","root"],"mappings":"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"}
|
@@ -35,7 +35,7 @@ var FloatingPopover = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
35
35
|
placement: placement === 'auto' ? undefined : placement,
|
36
36
|
open: opened,
|
37
37
|
middleware: [placement === 'auto' && react.autoPlacement(), react.offset({
|
38
|
-
mainAxis: (offset === null || offset === void 0 ? void 0 : offset[1]) || (isInner ?
|
38
|
+
mainAxis: (offset === null || offset === void 0 ? void 0 : offset[1]) || (isInner ? LIST_PADDING * 2 : 0),
|
39
39
|
crossAxis: (offset === null || offset === void 0 ? void 0 : offset[0]) || (isInner ? -LIST_PADDING : 0)
|
40
40
|
}), react.flip({
|
41
41
|
fallbackAxisSideDirection: 'end'
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"FloatingPopover.js","sources":["../../../src/components/Dropdown/FloatingPopover.tsx"],"sourcesContent":["import {\n flip,\n shift,\n useFloating,\n FloatingPortal,\n offset as offsetMiddleware,\n autoPlacement,\n autoUpdate,\n} from '@floating-ui/react';\nimport React, { forwardRef, MouseEvent } from 'react';\nimport { safeUseId } from '@salutejs/plasma-core';\n\nimport { FloatingPopoverProps } from './Dropdown.types';\n\n// TODO: #2003\nconst LIST_PADDING = 2;\n\nconst FloatingPopover = forwardRef<HTMLDivElement, FloatingPopoverProps>(\n ({ target, children, opened, onToggle, placement, portal, offset, isInner, trigger, zIndex }, ref) => {\n const { refs, floatingStyles } = useFloating({\n whileElementsMounted(referenceEl, floatingEl, update) {\n return autoUpdate(referenceEl, floatingEl, update, {\n ancestorScroll: false,\n ancestorResize: false,\n layoutShift: false,\n });\n },\n placement: placement === 'auto' ? undefined : placement,\n open: opened,\n middleware: [\n placement === 'auto' && autoPlacement(),\n offsetMiddleware({\n mainAxis: offset?.[1] || (isInner ?
|
1
|
+
{"version":3,"file":"FloatingPopover.js","sources":["../../../src/components/Dropdown/FloatingPopover.tsx"],"sourcesContent":["import {\n flip,\n shift,\n useFloating,\n FloatingPortal,\n offset as offsetMiddleware,\n autoPlacement,\n autoUpdate,\n} from '@floating-ui/react';\nimport React, { forwardRef, MouseEvent } from 'react';\nimport { safeUseId } from '@salutejs/plasma-core';\n\nimport { FloatingPopoverProps } from './Dropdown.types';\n\n// TODO: #2003\nconst LIST_PADDING = 2;\n\nconst FloatingPopover = forwardRef<HTMLDivElement, FloatingPopoverProps>(\n ({ target, children, opened, onToggle, placement, portal, offset, isInner, trigger, zIndex }, ref) => {\n const { refs, floatingStyles } = useFloating({\n whileElementsMounted(referenceEl, floatingEl, update) {\n return autoUpdate(referenceEl, floatingEl, update, {\n ancestorScroll: false,\n ancestorResize: false,\n layoutShift: false,\n });\n },\n placement: placement === 'auto' ? undefined : placement,\n open: opened,\n middleware: [\n placement === 'auto' && autoPlacement(),\n offsetMiddleware({\n mainAxis: offset?.[1] || (isInner ? LIST_PADDING * 2 : 0),\n crossAxis: offset?.[0] || (isInner ? -LIST_PADDING : 0),\n }),\n flip({ fallbackAxisSideDirection: 'end' }),\n shift(),\n ],\n });\n const wrappedId = safeUseId();\n\n const handleTargetClick = (event: MouseEvent<HTMLDivElement>) => {\n if (trigger === 'hover') {\n return;\n }\n\n if (onToggle) {\n onToggle(!opened, event);\n }\n };\n\n const handleTargetMouseEnter = (event: MouseEvent<HTMLDivElement>) => {\n if (trigger === 'click' || opened) {\n return;\n }\n\n onToggle(true, event);\n };\n\n const handleTargetMouseLeave = (event: MouseEvent<HTMLDivElement>) => {\n if (event.relatedTarget instanceof HTMLElement && refs.floating.current instanceof HTMLElement) {\n if (\n trigger === 'click' ||\n !opened ||\n (event.relatedTarget && refs.floating && refs.floating.current?.contains(event.relatedTarget))\n ) {\n return;\n }\n\n onToggle(false, event);\n }\n };\n\n const handleFloatingMouseLeave = (event: MouseEvent) => {\n if (event.relatedTarget instanceof HTMLElement && refs.reference.current instanceof HTMLElement) {\n if (\n trigger === 'click' ||\n !opened ||\n (event.relatedTarget && refs.reference && refs.reference.current?.contains(event.relatedTarget))\n ) {\n return;\n }\n\n onToggle(false, event);\n }\n };\n\n return (\n <div\n ref={ref}\n id={wrappedId}\n style={{\n position: 'relative',\n display: isInner ? 'block' : 'inline-block',\n }}\n >\n <div\n ref={refs.setReference}\n onClick={handleTargetClick}\n onMouseEnter={handleTargetMouseEnter}\n onMouseLeave={handleTargetMouseLeave}\n >\n {target}\n </div>\n\n {opened && (\n <FloatingPortal {...getFloatingPortalProps(portal, wrappedId)}>\n <div\n ref={refs.setFloating}\n onMouseLeave={handleFloatingMouseLeave}\n style={{\n ...floatingStyles,\n zIndex: zIndex || 1000,\n }}\n >\n {children}\n </div>\n </FloatingPortal>\n )}\n </div>\n );\n },\n);\n\ntype FloatingPortalReturnedProps = {\n root?: React.RefObject<HTMLElement>;\n id?: string;\n};\n\n// root - принимает ref контейнера портала.\n// id - если есть портал - не используется, если портала нет - подставляется 'wrappedId'.\nconst getFloatingPortalProps = (\n portal: FloatingPopoverProps['portal'],\n wrappedId: string,\n): FloatingPortalReturnedProps => {\n if (!portal) {\n return { id: wrappedId };\n }\n\n if (typeof portal === 'string') {\n return { id: portal };\n }\n\n return { root: portal };\n};\n\nexport { FloatingPopover };\n"],"names":["LIST_PADDING","FloatingPopover","forwardRef","_ref","ref","target","children","opened","onToggle","placement","portal","offset","isInner","trigger","zIndex","_useFloating","useFloating","whileElementsMounted","referenceEl","floatingEl","update","autoUpdate","ancestorScroll","ancestorResize","layoutShift","undefined","open","middleware","autoPlacement","offsetMiddleware","mainAxis","crossAxis","flip","fallbackAxisSideDirection","shift","refs","floatingStyles","wrappedId","safeUseId","handleTargetClick","event","handleTargetMouseEnter","handleTargetMouseLeave","relatedTarget","HTMLElement","floating","current","_refs$floating$curren","contains","handleFloatingMouseLeave","reference","_refs$reference$curre","React","createElement","id","style","position","display","setReference","onClick","onMouseEnter","onMouseLeave","FloatingPortal","getFloatingPortalProps","setFloating","_objectSpread","root"],"mappings":"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"}
|
@@ -36,7 +36,7 @@ var FloatingPopover = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
36
36
|
placement: getPlacement.getPlacement(placement),
|
37
37
|
open: opened,
|
38
38
|
middleware: [react.offset({
|
39
|
-
mainAxis: isInner ?
|
39
|
+
mainAxis: isInner ? LIST_PADDING * 2 : 0,
|
40
40
|
alignmentAxis: isInner ? -LIST_PADDING : 0
|
41
41
|
}), react.flip({
|
42
42
|
fallbackPlacements: getFallbackPlacements.getFallbackPlacements(placement)
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"FloatingPopover.js","sources":["../../../src/components/Select/FloatingPopover.tsx"],"sourcesContent":["import {\n flip,\n shift,\n size,\n useFloating,\n FloatingPortal,\n offset as offsetMiddleware,\n autoUpdate,\n} from '@floating-ui/react';\nimport React, { forwardRef } from 'react';\nimport { safeUseId } from '@salutejs/plasma-core';\n\nimport { getPlacement, getFallbackPlacements } from './utils';\nimport type { FloatingPopoverProps } from './Select.types';\n\n// TODO: #2003\nconst LIST_PADDING = 2;\n\nconst FloatingPopover = forwardRef<HTMLDivElement, FloatingPopoverProps>(\n ({ target, children, opened, onToggle, placement, portal, listWidth, zIndex, isInner }, ref) => {\n const { refs, floatingStyles } = useFloating({\n whileElementsMounted(referenceEl, floatingEl, update) {\n return autoUpdate(referenceEl, floatingEl, update, {\n ancestorScroll: false,\n ancestorResize: false,\n layoutShift: false,\n });\n },\n placement: getPlacement(placement),\n open: opened,\n middleware: [\n offsetMiddleware({
|
1
|
+
{"version":3,"file":"FloatingPopover.js","sources":["../../../src/components/Select/FloatingPopover.tsx"],"sourcesContent":["import {\n flip,\n shift,\n size,\n useFloating,\n FloatingPortal,\n offset as offsetMiddleware,\n autoUpdate,\n} from '@floating-ui/react';\nimport React, { forwardRef } from 'react';\nimport { safeUseId } from '@salutejs/plasma-core';\n\nimport { getPlacement, getFallbackPlacements } from './utils';\nimport type { FloatingPopoverProps } from './Select.types';\n\n// TODO: #2003\nconst LIST_PADDING = 2;\n\nconst FloatingPopover = forwardRef<HTMLDivElement, FloatingPopoverProps>(\n ({ target, children, opened, onToggle, placement, portal, listWidth, zIndex, isInner }, ref) => {\n const { refs, floatingStyles } = useFloating({\n whileElementsMounted(referenceEl, floatingEl, update) {\n return autoUpdate(referenceEl, floatingEl, update, {\n ancestorScroll: false,\n ancestorResize: false,\n layoutShift: false,\n });\n },\n placement: getPlacement(placement),\n open: opened,\n middleware: [\n offsetMiddleware({\n mainAxis: isInner ? LIST_PADDING * 2 : 0,\n alignmentAxis: isInner ? -LIST_PADDING : 0,\n }),\n flip({ fallbackPlacements: getFallbackPlacements(placement) }),\n shift(),\n size({\n apply({ rects, elements }) {\n Object.assign(elements.floating.style, {\n width:\n listWidth ||\n `${isInner ? rects.reference.width + LIST_PADDING * 2 : rects.reference.width}px`,\n });\n },\n }),\n ],\n });\n\n const wrappedId = safeUseId();\n\n const handleClick = () => {\n if (onToggle) {\n onToggle(!opened);\n }\n };\n\n // Проверка на target. Это может быть как ReactNode, так и функция, в которую пробрасывается ref.\n // Это нужно для более тонкой настройки reference-элемента, вокруг которого и будет позиционироваться выпадашка.\n // Пример: когда в Textfield под инпутом находится helperText (или еще что-либо),\n // но выпадающий список должен позиционироваться непосредственно возле самого инпута.\n const isTargetAsFunction = typeof target === 'function';\n\n return (\n <div ref={ref} id={wrappedId} style={{ position: 'relative' }}>\n <div ref={isTargetAsFunction ? undefined : refs.setReference} onClick={handleClick}>\n {typeof target === 'function' ? target(refs.setReference as any) : target}\n </div>\n\n {opened && (\n // root - принимает ref контейнера портала.\n // id - если есть портал - не используется, если портала нет - подставляется 'wrappedId'.\n <FloatingPortal {...getFloatingPortalProps(portal, wrappedId)}>\n <div ref={refs.setFloating} style={{ ...floatingStyles, zIndex: zIndex || 1000 }}>\n {children}\n </div>\n </FloatingPortal>\n )}\n </div>\n );\n },\n);\n\ntype FloatingPortalReturnedProps = {\n root?: React.RefObject<HTMLElement>;\n id?: string;\n};\n\n// root - принимает ref контейнера портала.\n// id - если есть портал - не используется, если портала нет - подставляется 'wrappedId'.\nconst getFloatingPortalProps = (\n portal: FloatingPopoverProps['portal'],\n wrappedId: string,\n): FloatingPortalReturnedProps => {\n if (!portal) {\n return { id: wrappedId };\n }\n\n if (typeof portal === 'string') {\n return { id: portal };\n }\n\n return { root: portal };\n};\n\nexport { FloatingPopover };\n"],"names":["LIST_PADDING","FloatingPopover","forwardRef","_ref","ref","target","children","opened","onToggle","placement","portal","listWidth","zIndex","isInner","_useFloating","useFloating","whileElementsMounted","referenceEl","floatingEl","update","autoUpdate","ancestorScroll","ancestorResize","layoutShift","getPlacement","open","middleware","offsetMiddleware","mainAxis","alignmentAxis","flip","fallbackPlacements","getFallbackPlacements","shift","size","apply","_ref2","rects","elements","Object","assign","floating","style","width","concat","reference","refs","floatingStyles","wrappedId","safeUseId","handleClick","isTargetAsFunction","React","createElement","id","position","undefined","setReference","onClick","FloatingPortal","getFloatingPortalProps","setFloating","_objectSpread","root"],"mappings":"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"}
|
@@ -38,7 +38,7 @@ var FloatingPopover = exports.FloatingPopover = /*#__PURE__*/(0, _react2.forward
|
|
38
38
|
placement: placement,
|
39
39
|
open: opened,
|
40
40
|
middleware: [(0, _react.offset)({
|
41
|
-
mainAxis: isInner ?
|
41
|
+
mainAxis: isInner ? LIST_PADDING * 2 : 0,
|
42
42
|
alignmentAxis: isInner ? -LIST_PADDING : 0
|
43
43
|
}), (0, _react.flip)({
|
44
44
|
fallbackAxisSideDirection: 'end'
|
@@ -39,7 +39,7 @@ var FloatingPopover = exports.FloatingPopover = /*#__PURE__*/(0, _react2.forward
|
|
39
39
|
placement: placement === 'auto' ? undefined : placement,
|
40
40
|
open: opened,
|
41
41
|
middleware: [placement === 'auto' && (0, _react.autoPlacement)(), (0, _react.offset)({
|
42
|
-
mainAxis: (offset === null || offset === void 0 ? void 0 : offset[1]) || (isInner ?
|
42
|
+
mainAxis: (offset === null || offset === void 0 ? void 0 : offset[1]) || (isInner ? LIST_PADDING * 2 : 0),
|
43
43
|
crossAxis: (offset === null || offset === void 0 ? void 0 : offset[0]) || (isInner ? -LIST_PADDING : 0)
|
44
44
|
}), (0, _react.flip)({
|
45
45
|
fallbackAxisSideDirection: 'end'
|
@@ -39,7 +39,7 @@ var FloatingPopover = exports.FloatingPopover = /*#__PURE__*/(0, _react2.forward
|
|
39
39
|
placement: (0, _utils.getPlacement)(placement),
|
40
40
|
open: opened,
|
41
41
|
middleware: [(0, _react.offset)({
|
42
|
-
mainAxis: isInner ?
|
42
|
+
mainAxis: isInner ? LIST_PADDING * 2 : 0,
|
43
43
|
alignmentAxis: isInner ? -LIST_PADDING : 0
|
44
44
|
}), (0, _react.flip)({
|
45
45
|
fallbackPlacements: (0, _utils.getFallbackPlacements)(placement)
|
@@ -30,7 +30,7 @@ var FloatingPopover = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
30
30
|
placement: placement,
|
31
31
|
open: opened,
|
32
32
|
middleware: [offsetMiddleware({
|
33
|
-
mainAxis: isInner ?
|
33
|
+
mainAxis: isInner ? LIST_PADDING * 2 : 0,
|
34
34
|
alignmentAxis: isInner ? -LIST_PADDING : 0
|
35
35
|
}), flip({
|
36
36
|
fallbackAxisSideDirection: 'end'
|
@@ -31,7 +31,7 @@ var FloatingPopover = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
31
31
|
placement: placement === 'auto' ? undefined : placement,
|
32
32
|
open: opened,
|
33
33
|
middleware: [placement === 'auto' && autoPlacement(), offsetMiddleware({
|
34
|
-
mainAxis: (offset === null || offset === void 0 ? void 0 : offset[1]) || (isInner ?
|
34
|
+
mainAxis: (offset === null || offset === void 0 ? void 0 : offset[1]) || (isInner ? LIST_PADDING * 2 : 0),
|
35
35
|
crossAxis: (offset === null || offset === void 0 ? void 0 : offset[0]) || (isInner ? -LIST_PADDING : 0)
|
36
36
|
}), flip({
|
37
37
|
fallbackAxisSideDirection: 'end'
|
@@ -31,7 +31,7 @@ var FloatingPopover = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
31
31
|
placement: getPlacement(placement),
|
32
32
|
open: opened,
|
33
33
|
middleware: [offsetMiddleware({
|
34
|
-
mainAxis: isInner ?
|
34
|
+
mainAxis: isInner ? LIST_PADDING * 2 : 0,
|
35
35
|
alignmentAxis: isInner ? -LIST_PADDING : 0
|
36
36
|
}), flip({
|
37
37
|
fallbackPlacements: getFallbackPlacements(placement)
|
@@ -26,7 +26,7 @@ var FloatingPopover = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
26
26
|
placement: placement,
|
27
27
|
open: opened,
|
28
28
|
middleware: [offset({
|
29
|
-
mainAxis: isInner ?
|
29
|
+
mainAxis: isInner ? LIST_PADDING * 2 : 0,
|
30
30
|
alignmentAxis: isInner ? -LIST_PADDING : 0
|
31
31
|
}), flip({
|
32
32
|
fallbackAxisSideDirection: 'end'
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"FloatingPopover.js","sources":["../../../../src/components/Combobox/ComboboxNew/FloatingPopover.tsx"],"sourcesContent":["import {\n flip,\n shift,\n size,\n useFloating,\n FloatingPortal,\n offset as offsetMiddleware,\n autoUpdate,\n} from '@floating-ui/react';\nimport React, { forwardRef } from 'react';\nimport { safeUseId } from '@salutejs/plasma-core';\n\nimport type { FloatingPopoverProps } from './Combobox.types';\n\n// TODO: #2003\nconst LIST_PADDING = 2;\n\nconst FloatingPopover = forwardRef<HTMLDivElement, FloatingPopoverProps>(\n ({ target, children, opened, onToggle, placement, portal, listWidth, zIndex, isInner }, ref) => {\n const { refs, floatingStyles } = useFloating({\n whileElementsMounted(referenceEl, floatingEl, update) {\n return autoUpdate(referenceEl, floatingEl, update, {\n ancestorScroll: false,\n ancestorResize: false,\n layoutShift: false,\n });\n },\n placement,\n open: opened,\n middleware: [\n offsetMiddleware({
|
1
|
+
{"version":3,"file":"FloatingPopover.js","sources":["../../../../src/components/Combobox/ComboboxNew/FloatingPopover.tsx"],"sourcesContent":["import {\n flip,\n shift,\n size,\n useFloating,\n FloatingPortal,\n offset as offsetMiddleware,\n autoUpdate,\n} from '@floating-ui/react';\nimport React, { forwardRef } from 'react';\nimport { safeUseId } from '@salutejs/plasma-core';\n\nimport type { FloatingPopoverProps } from './Combobox.types';\n\n// TODO: #2003\nconst LIST_PADDING = 2;\n\nconst FloatingPopover = forwardRef<HTMLDivElement, FloatingPopoverProps>(\n ({ target, children, opened, onToggle, placement, portal, listWidth, zIndex, isInner }, ref) => {\n const { refs, floatingStyles } = useFloating({\n whileElementsMounted(referenceEl, floatingEl, update) {\n return autoUpdate(referenceEl, floatingEl, update, {\n ancestorScroll: false,\n ancestorResize: false,\n layoutShift: false,\n });\n },\n placement,\n open: opened,\n middleware: [\n offsetMiddleware({\n mainAxis: isInner ? LIST_PADDING * 2 : 0,\n alignmentAxis: isInner ? -LIST_PADDING : 0,\n }),\n flip({ fallbackAxisSideDirection: 'end' }),\n shift(),\n size({\n apply({ rects, elements }) {\n Object.assign(elements.floating.style, {\n width:\n listWidth ||\n `${isInner ? rects.reference.width + LIST_PADDING * 2 : rects.reference.width}px`,\n });\n },\n }),\n ],\n });\n\n const wrappedId = safeUseId();\n\n const handleClick = () => {\n if (onToggle) {\n onToggle(!opened);\n }\n };\n\n // Проверка на target. Это может быть как ReactNode, так и функция, в которую пробрасывается ref.\n // Это нужно для более тонкой настройки reference-элемента, вокруг которого и будет позиционироваться выпадашка.\n // Пример: когда в Textfield под инпутом находится helperText (или еще что-либо),\n // но выпадающий список должен позиционироваться непосредственно возле самого инпута.\n const isTargetAsFunction = typeof target === 'function';\n\n return (\n <div ref={ref} id={wrappedId} style={{ position: 'relative' }}>\n <div ref={isTargetAsFunction ? undefined : refs.setReference} onClick={handleClick}>\n {typeof target === 'function' ? target(refs.setReference as any) : target}\n </div>\n\n {opened && (\n // root - принимает ref контейнера портала.\n // id - если есть портал - не используется, если портала нет - подставляется 'wrappedId'.\n <FloatingPortal {...getFloatingPortalProps(portal, wrappedId)}>\n <div ref={refs.setFloating} style={{ ...floatingStyles, zIndex: zIndex || 1000 }}>\n {children}\n </div>\n </FloatingPortal>\n )}\n </div>\n );\n },\n);\n\ntype FloatingPortalReturnedProps = {\n root?: React.RefObject<HTMLElement>;\n id?: string;\n};\n\n// root - принимает ref контейнера портала.\n// id - если есть портал - не используется, если портала нет - подставляется 'wrappedId'.\nconst getFloatingPortalProps = (\n portal: FloatingPopoverProps['portal'],\n wrappedId: string,\n): FloatingPortalReturnedProps => {\n if (!portal) {\n return { id: wrappedId };\n }\n\n if (typeof portal === 'string') {\n return { id: portal };\n }\n\n return { root: portal };\n};\n\nexport { FloatingPopover };\n"],"names":["LIST_PADDING","FloatingPopover","forwardRef","_ref","ref","target","children","opened","onToggle","placement","portal","listWidth","zIndex","isInner","_useFloating","useFloating","whileElementsMounted","referenceEl","floatingEl","update","autoUpdate","ancestorScroll","ancestorResize","layoutShift","open","middleware","offsetMiddleware","mainAxis","alignmentAxis","flip","fallbackAxisSideDirection","shift","size","apply","_ref2","rects","elements","Object","assign","floating","style","width","concat","reference","refs","floatingStyles","wrappedId","safeUseId","handleClick","isTargetAsFunction","React","createElement","id","position","undefined","setReference","onClick","FloatingPortal","getFloatingPortalProps","setFloating","_objectSpread","root"],"mappings":"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"}
|
@@ -27,7 +27,7 @@ var FloatingPopover = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
27
27
|
placement: placement === 'auto' ? undefined : placement,
|
28
28
|
open: opened,
|
29
29
|
middleware: [placement === 'auto' && autoPlacement(), offset({
|
30
|
-
mainAxis: (offset$1 === null || offset$1 === void 0 ? void 0 : offset$1[1]) || (isInner ?
|
30
|
+
mainAxis: (offset$1 === null || offset$1 === void 0 ? void 0 : offset$1[1]) || (isInner ? LIST_PADDING * 2 : 0),
|
31
31
|
crossAxis: (offset$1 === null || offset$1 === void 0 ? void 0 : offset$1[0]) || (isInner ? -LIST_PADDING : 0)
|
32
32
|
}), flip({
|
33
33
|
fallbackAxisSideDirection: 'end'
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"FloatingPopover.js","sources":["../../../src/components/Dropdown/FloatingPopover.tsx"],"sourcesContent":["import {\n flip,\n shift,\n useFloating,\n FloatingPortal,\n offset as offsetMiddleware,\n autoPlacement,\n autoUpdate,\n} from '@floating-ui/react';\nimport React, { forwardRef, MouseEvent } from 'react';\nimport { safeUseId } from '@salutejs/plasma-core';\n\nimport { FloatingPopoverProps } from './Dropdown.types';\n\n// TODO: #2003\nconst LIST_PADDING = 2;\n\nconst FloatingPopover = forwardRef<HTMLDivElement, FloatingPopoverProps>(\n ({ target, children, opened, onToggle, placement, portal, offset, isInner, trigger, zIndex }, ref) => {\n const { refs, floatingStyles } = useFloating({\n whileElementsMounted(referenceEl, floatingEl, update) {\n return autoUpdate(referenceEl, floatingEl, update, {\n ancestorScroll: false,\n ancestorResize: false,\n layoutShift: false,\n });\n },\n placement: placement === 'auto' ? undefined : placement,\n open: opened,\n middleware: [\n placement === 'auto' && autoPlacement(),\n offsetMiddleware({\n mainAxis: offset?.[1] || (isInner ?
|
1
|
+
{"version":3,"file":"FloatingPopover.js","sources":["../../../src/components/Dropdown/FloatingPopover.tsx"],"sourcesContent":["import {\n flip,\n shift,\n useFloating,\n FloatingPortal,\n offset as offsetMiddleware,\n autoPlacement,\n autoUpdate,\n} from '@floating-ui/react';\nimport React, { forwardRef, MouseEvent } from 'react';\nimport { safeUseId } from '@salutejs/plasma-core';\n\nimport { FloatingPopoverProps } from './Dropdown.types';\n\n// TODO: #2003\nconst LIST_PADDING = 2;\n\nconst FloatingPopover = forwardRef<HTMLDivElement, FloatingPopoverProps>(\n ({ target, children, opened, onToggle, placement, portal, offset, isInner, trigger, zIndex }, ref) => {\n const { refs, floatingStyles } = useFloating({\n whileElementsMounted(referenceEl, floatingEl, update) {\n return autoUpdate(referenceEl, floatingEl, update, {\n ancestorScroll: false,\n ancestorResize: false,\n layoutShift: false,\n });\n },\n placement: placement === 'auto' ? undefined : placement,\n open: opened,\n middleware: [\n placement === 'auto' && autoPlacement(),\n offsetMiddleware({\n mainAxis: offset?.[1] || (isInner ? LIST_PADDING * 2 : 0),\n crossAxis: offset?.[0] || (isInner ? -LIST_PADDING : 0),\n }),\n flip({ fallbackAxisSideDirection: 'end' }),\n shift(),\n ],\n });\n const wrappedId = safeUseId();\n\n const handleTargetClick = (event: MouseEvent<HTMLDivElement>) => {\n if (trigger === 'hover') {\n return;\n }\n\n if (onToggle) {\n onToggle(!opened, event);\n }\n };\n\n const handleTargetMouseEnter = (event: MouseEvent<HTMLDivElement>) => {\n if (trigger === 'click' || opened) {\n return;\n }\n\n onToggle(true, event);\n };\n\n const handleTargetMouseLeave = (event: MouseEvent<HTMLDivElement>) => {\n if (event.relatedTarget instanceof HTMLElement && refs.floating.current instanceof HTMLElement) {\n if (\n trigger === 'click' ||\n !opened ||\n (event.relatedTarget && refs.floating && refs.floating.current?.contains(event.relatedTarget))\n ) {\n return;\n }\n\n onToggle(false, event);\n }\n };\n\n const handleFloatingMouseLeave = (event: MouseEvent) => {\n if (event.relatedTarget instanceof HTMLElement && refs.reference.current instanceof HTMLElement) {\n if (\n trigger === 'click' ||\n !opened ||\n (event.relatedTarget && refs.reference && refs.reference.current?.contains(event.relatedTarget))\n ) {\n return;\n }\n\n onToggle(false, event);\n }\n };\n\n return (\n <div\n ref={ref}\n id={wrappedId}\n style={{\n position: 'relative',\n display: isInner ? 'block' : 'inline-block',\n }}\n >\n <div\n ref={refs.setReference}\n onClick={handleTargetClick}\n onMouseEnter={handleTargetMouseEnter}\n onMouseLeave={handleTargetMouseLeave}\n >\n {target}\n </div>\n\n {opened && (\n <FloatingPortal {...getFloatingPortalProps(portal, wrappedId)}>\n <div\n ref={refs.setFloating}\n onMouseLeave={handleFloatingMouseLeave}\n style={{\n ...floatingStyles,\n zIndex: zIndex || 1000,\n }}\n >\n {children}\n </div>\n </FloatingPortal>\n )}\n </div>\n );\n },\n);\n\ntype FloatingPortalReturnedProps = {\n root?: React.RefObject<HTMLElement>;\n id?: string;\n};\n\n// root - принимает ref контейнера портала.\n// id - если есть портал - не используется, если портала нет - подставляется 'wrappedId'.\nconst getFloatingPortalProps = (\n portal: FloatingPopoverProps['portal'],\n wrappedId: string,\n): FloatingPortalReturnedProps => {\n if (!portal) {\n return { id: wrappedId };\n }\n\n if (typeof portal === 'string') {\n return { id: portal };\n }\n\n return { root: portal };\n};\n\nexport { FloatingPopover };\n"],"names":["LIST_PADDING","FloatingPopover","forwardRef","_ref","ref","target","children","opened","onToggle","placement","portal","offset","isInner","trigger","zIndex","_useFloating","useFloating","whileElementsMounted","referenceEl","floatingEl","update","autoUpdate","ancestorScroll","ancestorResize","layoutShift","undefined","open","middleware","autoPlacement","offsetMiddleware","mainAxis","crossAxis","flip","fallbackAxisSideDirection","shift","refs","floatingStyles","wrappedId","safeUseId","handleTargetClick","event","handleTargetMouseEnter","handleTargetMouseLeave","relatedTarget","HTMLElement","floating","current","_refs$floating$curren","contains","handleFloatingMouseLeave","reference","_refs$reference$curre","React","createElement","id","style","position","display","setReference","onClick","onMouseEnter","onMouseLeave","FloatingPortal","getFloatingPortalProps","setFloating","_objectSpread","root"],"mappings":"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"}
|
@@ -28,7 +28,7 @@ var FloatingPopover = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
28
28
|
placement: getPlacement(placement),
|
29
29
|
open: opened,
|
30
30
|
middleware: [offset({
|
31
|
-
mainAxis: isInner ?
|
31
|
+
mainAxis: isInner ? LIST_PADDING * 2 : 0,
|
32
32
|
alignmentAxis: isInner ? -LIST_PADDING : 0
|
33
33
|
}), flip({
|
34
34
|
fallbackPlacements: getFallbackPlacements(placement)
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"FloatingPopover.js","sources":["../../../src/components/Select/FloatingPopover.tsx"],"sourcesContent":["import {\n flip,\n shift,\n size,\n useFloating,\n FloatingPortal,\n offset as offsetMiddleware,\n autoUpdate,\n} from '@floating-ui/react';\nimport React, { forwardRef } from 'react';\nimport { safeUseId } from '@salutejs/plasma-core';\n\nimport { getPlacement, getFallbackPlacements } from './utils';\nimport type { FloatingPopoverProps } from './Select.types';\n\n// TODO: #2003\nconst LIST_PADDING = 2;\n\nconst FloatingPopover = forwardRef<HTMLDivElement, FloatingPopoverProps>(\n ({ target, children, opened, onToggle, placement, portal, listWidth, zIndex, isInner }, ref) => {\n const { refs, floatingStyles } = useFloating({\n whileElementsMounted(referenceEl, floatingEl, update) {\n return autoUpdate(referenceEl, floatingEl, update, {\n ancestorScroll: false,\n ancestorResize: false,\n layoutShift: false,\n });\n },\n placement: getPlacement(placement),\n open: opened,\n middleware: [\n offsetMiddleware({
|
1
|
+
{"version":3,"file":"FloatingPopover.js","sources":["../../../src/components/Select/FloatingPopover.tsx"],"sourcesContent":["import {\n flip,\n shift,\n size,\n useFloating,\n FloatingPortal,\n offset as offsetMiddleware,\n autoUpdate,\n} from '@floating-ui/react';\nimport React, { forwardRef } from 'react';\nimport { safeUseId } from '@salutejs/plasma-core';\n\nimport { getPlacement, getFallbackPlacements } from './utils';\nimport type { FloatingPopoverProps } from './Select.types';\n\n// TODO: #2003\nconst LIST_PADDING = 2;\n\nconst FloatingPopover = forwardRef<HTMLDivElement, FloatingPopoverProps>(\n ({ target, children, opened, onToggle, placement, portal, listWidth, zIndex, isInner }, ref) => {\n const { refs, floatingStyles } = useFloating({\n whileElementsMounted(referenceEl, floatingEl, update) {\n return autoUpdate(referenceEl, floatingEl, update, {\n ancestorScroll: false,\n ancestorResize: false,\n layoutShift: false,\n });\n },\n placement: getPlacement(placement),\n open: opened,\n middleware: [\n offsetMiddleware({\n mainAxis: isInner ? LIST_PADDING * 2 : 0,\n alignmentAxis: isInner ? -LIST_PADDING : 0,\n }),\n flip({ fallbackPlacements: getFallbackPlacements(placement) }),\n shift(),\n size({\n apply({ rects, elements }) {\n Object.assign(elements.floating.style, {\n width:\n listWidth ||\n `${isInner ? rects.reference.width + LIST_PADDING * 2 : rects.reference.width}px`,\n });\n },\n }),\n ],\n });\n\n const wrappedId = safeUseId();\n\n const handleClick = () => {\n if (onToggle) {\n onToggle(!opened);\n }\n };\n\n // Проверка на target. Это может быть как ReactNode, так и функция, в которую пробрасывается ref.\n // Это нужно для более тонкой настройки reference-элемента, вокруг которого и будет позиционироваться выпадашка.\n // Пример: когда в Textfield под инпутом находится helperText (или еще что-либо),\n // но выпадающий список должен позиционироваться непосредственно возле самого инпута.\n const isTargetAsFunction = typeof target === 'function';\n\n return (\n <div ref={ref} id={wrappedId} style={{ position: 'relative' }}>\n <div ref={isTargetAsFunction ? undefined : refs.setReference} onClick={handleClick}>\n {typeof target === 'function' ? target(refs.setReference as any) : target}\n </div>\n\n {opened && (\n // root - принимает ref контейнера портала.\n // id - если есть портал - не используется, если портала нет - подставляется 'wrappedId'.\n <FloatingPortal {...getFloatingPortalProps(portal, wrappedId)}>\n <div ref={refs.setFloating} style={{ ...floatingStyles, zIndex: zIndex || 1000 }}>\n {children}\n </div>\n </FloatingPortal>\n )}\n </div>\n );\n },\n);\n\ntype FloatingPortalReturnedProps = {\n root?: React.RefObject<HTMLElement>;\n id?: string;\n};\n\n// root - принимает ref контейнера портала.\n// id - если есть портал - не используется, если портала нет - подставляется 'wrappedId'.\nconst getFloatingPortalProps = (\n portal: FloatingPopoverProps['portal'],\n wrappedId: string,\n): FloatingPortalReturnedProps => {\n if (!portal) {\n return { id: wrappedId };\n }\n\n if (typeof portal === 'string') {\n return { id: portal };\n }\n\n return { root: portal };\n};\n\nexport { FloatingPopover };\n"],"names":["LIST_PADDING","FloatingPopover","forwardRef","_ref","ref","target","children","opened","onToggle","placement","portal","listWidth","zIndex","isInner","_useFloating","useFloating","whileElementsMounted","referenceEl","floatingEl","update","autoUpdate","ancestorScroll","ancestorResize","layoutShift","getPlacement","open","middleware","offsetMiddleware","mainAxis","alignmentAxis","flip","fallbackPlacements","getFallbackPlacements","shift","size","apply","_ref2","rects","elements","Object","assign","floating","style","width","concat","reference","refs","floatingStyles","wrappedId","safeUseId","handleClick","isTargetAsFunction","React","createElement","id","position","undefined","setReference","onClick","FloatingPortal","getFloatingPortalProps","setFloating","_objectSpread","root"],"mappings":"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"}
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@salutejs/plasma-new-hope",
|
3
|
-
"version": "0.326.0-canary.1986.
|
3
|
+
"version": "0.326.0-canary.1986.15390157539.0",
|
4
4
|
"description": "Salute Design System blueprint",
|
5
5
|
"main": "cjs/index.js",
|
6
6
|
"module": "es/index.js",
|
@@ -137,5 +137,5 @@
|
|
137
137
|
"sideEffects": [
|
138
138
|
"*.css"
|
139
139
|
],
|
140
|
-
"gitHead": "
|
140
|
+
"gitHead": "56a0bcf87da3929eb648a4caa686620f42af9a8e"
|
141
141
|
}
|
@@ -38,7 +38,7 @@ var FloatingPopover = exports.FloatingPopover = /*#__PURE__*/(0, _react2.forward
|
|
38
38
|
placement: placement,
|
39
39
|
open: opened,
|
40
40
|
middleware: [(0, _react.offset)({
|
41
|
-
mainAxis: isInner ?
|
41
|
+
mainAxis: isInner ? LIST_PADDING * 2 : 0,
|
42
42
|
alignmentAxis: isInner ? -LIST_PADDING : 0
|
43
43
|
}), (0, _react.flip)({
|
44
44
|
fallbackAxisSideDirection: 'end'
|
@@ -39,7 +39,7 @@ var FloatingPopover = exports.FloatingPopover = /*#__PURE__*/(0, _react2.forward
|
|
39
39
|
placement: placement === 'auto' ? undefined : placement,
|
40
40
|
open: opened,
|
41
41
|
middleware: [placement === 'auto' && (0, _react.autoPlacement)(), (0, _react.offset)({
|
42
|
-
mainAxis: (offset === null || offset === void 0 ? void 0 : offset[1]) || (isInner ?
|
42
|
+
mainAxis: (offset === null || offset === void 0 ? void 0 : offset[1]) || (isInner ? LIST_PADDING * 2 : 0),
|
43
43
|
crossAxis: (offset === null || offset === void 0 ? void 0 : offset[0]) || (isInner ? -LIST_PADDING : 0)
|
44
44
|
}), (0, _react.flip)({
|
45
45
|
fallbackAxisSideDirection: 'end'
|
@@ -39,7 +39,7 @@ var FloatingPopover = exports.FloatingPopover = /*#__PURE__*/(0, _react2.forward
|
|
39
39
|
placement: (0, _utils.getPlacement)(placement),
|
40
40
|
open: opened,
|
41
41
|
middleware: [(0, _react.offset)({
|
42
|
-
mainAxis: isInner ?
|
42
|
+
mainAxis: isInner ? LIST_PADDING * 2 : 0,
|
43
43
|
alignmentAxis: isInner ? -LIST_PADDING : 0
|
44
44
|
}), (0, _react.flip)({
|
45
45
|
fallbackPlacements: (0, _utils.getFallbackPlacements)(placement)
|
@@ -30,7 +30,7 @@ var FloatingPopover = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
30
30
|
placement: placement,
|
31
31
|
open: opened,
|
32
32
|
middleware: [offsetMiddleware({
|
33
|
-
mainAxis: isInner ?
|
33
|
+
mainAxis: isInner ? LIST_PADDING * 2 : 0,
|
34
34
|
alignmentAxis: isInner ? -LIST_PADDING : 0
|
35
35
|
}), flip({
|
36
36
|
fallbackAxisSideDirection: 'end'
|
@@ -31,7 +31,7 @@ var FloatingPopover = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
31
31
|
placement: placement === 'auto' ? undefined : placement,
|
32
32
|
open: opened,
|
33
33
|
middleware: [placement === 'auto' && autoPlacement(), offsetMiddleware({
|
34
|
-
mainAxis: (offset === null || offset === void 0 ? void 0 : offset[1]) || (isInner ?
|
34
|
+
mainAxis: (offset === null || offset === void 0 ? void 0 : offset[1]) || (isInner ? LIST_PADDING * 2 : 0),
|
35
35
|
crossAxis: (offset === null || offset === void 0 ? void 0 : offset[0]) || (isInner ? -LIST_PADDING : 0)
|
36
36
|
}), flip({
|
37
37
|
fallbackAxisSideDirection: 'end'
|
@@ -31,7 +31,7 @@ var FloatingPopover = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
31
31
|
placement: getPlacement(placement),
|
32
32
|
open: opened,
|
33
33
|
middleware: [offsetMiddleware({
|
34
|
-
mainAxis: isInner ?
|
34
|
+
mainAxis: isInner ? LIST_PADDING * 2 : 0,
|
35
35
|
alignmentAxis: isInner ? -LIST_PADDING : 0
|
36
36
|
}), flip({
|
37
37
|
fallbackPlacements: getFallbackPlacements(placement)
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"FloatingPopover.d.ts","sourceRoot":"","sources":["../../../../src/components/Combobox/ComboboxNew/FloatingPopover.tsx"],"names":[],"mappings":"AASA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAG1C,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAK7D,QAAA,MAAM,eAAe,
|
1
|
+
{"version":3,"file":"FloatingPopover.d.ts","sourceRoot":"","sources":["../../../../src/components/Combobox/ComboboxNew/FloatingPopover.tsx"],"names":[],"mappings":"AASA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAG1C,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAK7D,QAAA,MAAM,eAAe,6FA+DpB,CAAC;AAwBF,OAAO,EAAE,eAAe,EAAE,CAAC"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"FloatingPopover.d.ts","sourceRoot":"","sources":["../../../src/components/Select/FloatingPopover.tsx"],"names":[],"mappings":"AASA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAI1C,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAK3D,QAAA,MAAM,eAAe,
|
1
|
+
{"version":3,"file":"FloatingPopover.d.ts","sourceRoot":"","sources":["../../../src/components/Select/FloatingPopover.tsx"],"names":[],"mappings":"AASA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAI1C,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAK3D,QAAA,MAAM,eAAe,6FA+DpB,CAAC;AAwBF,OAAO,EAAE,eAAe,EAAE,CAAC"}
|