@pega/cosmos-react-core 9.0.0-build.2.3 → 9.0.0-build.2.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/components/AppShell/AppShell.styles.d.ts.map +1 -1
- package/lib/components/AppShell/AppShell.styles.js +3 -1
- package/lib/components/AppShell/AppShell.styles.js.map +1 -1
- package/lib/components/Avatar/Avatar.d.ts.map +1 -1
- package/lib/components/Avatar/Avatar.js +10 -4
- package/lib/components/Avatar/Avatar.js.map +1 -1
- package/lib/components/Banner/Banner.js +1 -1
- package/lib/components/Banner/Banner.js.map +1 -1
- package/lib/components/Drawer/Drawer.d.ts +7 -1
- package/lib/components/Drawer/Drawer.d.ts.map +1 -1
- package/lib/components/Drawer/Drawer.js +65 -8
- package/lib/components/Drawer/Drawer.js.map +1 -1
- package/lib/components/Drawer/ResizeHandle.d.ts +9 -0
- package/lib/components/Drawer/ResizeHandle.d.ts.map +1 -0
- package/lib/components/Drawer/ResizeHandle.js +109 -0
- package/lib/components/Drawer/ResizeHandle.js.map +1 -0
- package/lib/components/Drawer/index.d.ts +2 -0
- package/lib/components/Drawer/index.d.ts.map +1 -1
- package/lib/components/Drawer/index.js +1 -0
- package/lib/components/Drawer/index.js.map +1 -1
- package/lib/components/FieldValueList/FieldValueList.d.ts.map +1 -1
- package/lib/components/FieldValueList/FieldValueList.js +4 -1
- package/lib/components/FieldValueList/FieldValueList.js.map +1 -1
- package/lib/hooks/useI18n.d.ts +2 -0
- package/lib/hooks/useI18n.d.ts.map +1 -1
- package/lib/i18n/default.d.ts +2 -0
- package/lib/i18n/default.d.ts.map +1 -1
- package/lib/i18n/default.js +2 -0
- package/lib/i18n/default.js.map +1 -1
- package/lib/i18n/i18n.d.ts +2 -0
- package/lib/i18n/i18n.d.ts.map +1 -1
- package/lib/styles/constants.d.ts +5 -0
- package/lib/styles/constants.d.ts.map +1 -0
- package/lib/styles/constants.js +5 -0
- package/lib/styles/constants.js.map +1 -0
- package/lib/theme/themes/bootes2025Theme.json +1 -1
- package/lib/utils/getChildOfRootNode.d.ts +10 -0
- package/lib/utils/getChildOfRootNode.d.ts.map +1 -0
- package/lib/utils/getChildOfRootNode.js +19 -0
- package/lib/utils/getChildOfRootNode.js.map +1 -0
- package/lib/utils/index.d.ts +1 -0
- package/lib/utils/index.d.ts.map +1 -1
- package/lib/utils/index.js +1 -0
- package/lib/utils/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Drawer.js","sourceRoot":"","sources":["../../../src/components/Drawer/Drawer.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useCallback, forwardRef, useState } from 'react';\nimport type { Ref, FunctionComponent, ReactNode, TransitionEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { useOuterEvent, useConsolidatedRef, usePrevious } from '../../hooks';\nimport type { AsProp, BaseProps, ForwardProps } from '../../types';\nimport { reflow } from '../../utils';\nimport { defaultThemeProp } from '../../theme';\n\nexport interface DrawerProps extends AsProp, BaseProps {\n /**\n * If true, the Drawer will be visible.\n * @default false\n */\n open: boolean;\n /** Content of the Drawer. */\n children?: ReactNode;\n /**\n * Determines whether a drop shadow should be visible along the edge of the Drawer for contrast purposes.\n * @default false\n */\n shadow?: boolean;\n /**\n * Used to determine which side of the viewport the Drawer should open from.\n * @default 'right'\n */\n placement?: 'top' | 'right' | 'bottom' | 'left';\n /**\n * The position of the Drawer.\n * @default 'absolute'\n */\n position?: 'absolute' | 'fixed';\n /**\n * Determines the speed of the transition. This value comes from `theme.base.animation.speed`.\n * @default '0.25s'\n */\n transitionSpeed?: string;\n /**\n * The width or height that the Drawer will open to, depending on its placement.\n * @default '100%'\n */\n size?: string;\n /** Callback fired after Drawer opens. */\n onAfterOpen?: () => void;\n /** Callback fired after Drawer closes. */\n onAfterClose?: () => void;\n /** Callback fired before Drawer opens. */\n onBeforeOpen?: () => void;\n /** Callback fired before Drawer closes. */\n onBeforeClose?: () => void;\n /** Callback fired when a click action occurs outside of the Drawer. */\n onOuterClick?: () => void;\n /**\n * If true, removes the component from the real DOM when closed. For full virtual DOM unmount(if necessary), perform at a parent level.\n * @default false\n */\n nullWhenClosed?: boolean;\n}\n\ntype State = 'open' | 'closed' | 'opening' | 'closing';\n\nexport const StyledDrawer = styled.div<Partial<DrawerProps & { state: State }>>(props => {\n const { state, shadow, position, placement, transitionSpeed, size, theme } = props;\n let dimension = 'horizontal';\n let axis = 'X';\n let anchor = 'top';\n\n if (placement === 'top' || placement === 'bottom') {\n dimension = 'vertical';\n axis = 'Y';\n anchor = 'left';\n }\n\n const translate = state === 'open' || state === 'opening' ? 0 : '100%';\n const speed = transitionSpeed || theme.base.animation.speed;\n\n return css`\n z-index: ${theme.base['z-index'].drawer};\n position: ${position};\n ${placement}: 0;\n ${anchor}: 0;\n height: ${dimension === 'vertical' ? size : '100%'};\n width: ${dimension === 'horizontal' ? size : '100%'};\n transition-property: transform, box-shadow, opacity;\n transition-duration: max(${speed}, 0.0001s);\n transition-timing-function: ${theme.base.animation.timing.ease};\n transform: ${state === 'open'\n ? 'none'\n : `translate${axis}(${placement === 'top' || placement === 'left' ? '-' : ''}${translate})`};\n\n ${shadow &&\n css`\n box-shadow: ${theme.base.shadow.high};\n `}\n `;\n});\n\nStyledDrawer.defaultProps = defaultThemeProp;\n\nconst Drawer: FunctionComponent<DrawerProps & ForwardProps> = forwardRef(function Drawer(\n props: DrawerProps,\n ref: Ref<HTMLElement>\n) {\n const {\n open = false,\n shadow = false,\n position = 'absolute',\n children,\n placement = 'right',\n transitionSpeed,\n size = '100%',\n onAfterOpen,\n onAfterClose,\n onBeforeOpen,\n onBeforeClose,\n onOuterClick,\n nullWhenClosed = false,\n ...restProps\n } = props;\n\n const drawerRef = useConsolidatedRef(ref);\n\n const [state, setState] = useState<State>(open ? 'open' : 'closed');\n\n let prevState = usePrevious(state);\n if (!prevState) prevState = state;\n\n useOuterEvent(\n 'mousedown',\n [drawerRef],\n useCallback(() => {\n if (open) onOuterClick?.();\n }, [open, onOuterClick])\n );\n\n useEffect(() => {\n if (open && (state === 'closed' || state === 'closing')) {\n onBeforeOpen?.();\n reflow(drawerRef.current);\n setState('opening');\n } else if (!open && (state === 'open' || state === 'opening')) {\n onBeforeClose?.();\n setState('closing');\n } else if (open && state === 'open' && prevState !== 'open') {\n onAfterOpen?.();\n } else if (!open && state === 'closed' && prevState !== 'closed') {\n onAfterClose?.();\n }\n }, [open, state, prevState, onBeforeOpen, onBeforeClose, onAfterOpen, onAfterClose]);\n\n const onTransitionEnd = useCallback(\n (e: TransitionEvent): void => {\n if (e.target !== drawerRef.current || e.propertyName !== 'transform') return;\n setState(open ? 'open' : 'closed');\n },\n [open]\n );\n\n return state === 'closed' && !open && nullWhenClosed ? null : (\n <StyledDrawer\n ref={drawerRef}\n position={position}\n shadow={shadow && open}\n transitionSpeed={transitionSpeed}\n placement={placement}\n size={size}\n open={open}\n state={state}\n onTransitionEnd={onTransitionEnd}\n {...restProps}\n >\n {children}\n </StyledDrawer>\n );\n});\n\nexport default Drawer;\n"]}
|
|
1
|
+
{"version":3,"file":"Drawer.js","sourceRoot":"","sources":["../../../src/components/Drawer/Drawer.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useCallback, forwardRef, useState, useRef } from 'react';\nimport type {\n Ref,\n FunctionComponent,\n ReactNode,\n TransitionEvent,\n MouseEvent as ReactMouseEvent,\n KeyboardEvent as ReactKeyboardEvent\n} from 'react';\nimport styled, { css } from 'styled-components';\nimport { remToPx } from 'polished';\n\nimport { useOuterEvent, useConsolidatedRef, usePrevious, useDirection } from '../../hooks';\nimport type { AsProp, BaseProps, ForwardProps } from '../../types';\nimport { getChildOfRootNode, reflow } from '../../utils';\nimport { defaultThemeProp } from '../../theme';\nimport {\n resizeDrawerKeyboardStep,\n resizeDrawerMaxWidth,\n resizeDrawerMinWidth\n} from '../../styles/constants';\n\nimport ResizeHandle from './ResizeHandle';\n\nconst drawerMinWidth = remToPx(resizeDrawerMinWidth);\n\nexport interface DrawerProps extends AsProp, BaseProps {\n /**\n * If true, the Drawer will be visible.\n * @default false\n */\n open: boolean;\n /** Content of the Drawer. */\n children?: ReactNode;\n /**\n * Determines whether a drop shadow should be visible along the edge of the Drawer for contrast purposes.\n * @default false\n */\n shadow?: boolean;\n /**\n * Used to determine which side of the viewport the Drawer should open from.\n * @default 'right'\n */\n placement?: 'top' | 'right' | 'bottom' | 'left';\n /**\n * The position of the Drawer.\n * @default 'absolute'\n */\n position?: 'absolute' | 'fixed';\n /**\n * Determines the speed of the transition. This value comes from `theme.base.animation.speed`.\n * @default '0.25s'\n */\n transitionSpeed?: string;\n /**\n * The width or height that the Drawer will open to, depending on its placement.\n * If `resizeable`, is true this value will be overridden by the width set by the user.\n * @default '100%'\n */\n size?: string;\n /**\n * If true, the Drawer will be resizable. Will not be applied if `placement` is set to `top` or `bottom`.\n * @default false\n */\n resizeable?: boolean;\n /** Callback fired after Drawer opens. */\n onAfterOpen?: () => void;\n /** Callback fired after Drawer closes. */\n onAfterClose?: () => void;\n /** Callback fired before Drawer opens. */\n onBeforeOpen?: () => void;\n /** Callback fired before Drawer closes. */\n onBeforeClose?: () => void;\n /** Callback fired when a click action occurs outside of the Drawer. */\n onOuterClick?: () => void;\n /**\n * If true, removes the component from the real DOM when closed. For full virtual DOM unmount(if necessary), perform at a parent level.\n * @default false\n */\n nullWhenClosed?: boolean;\n}\n\ntype State = 'open' | 'closed' | 'opening' | 'closing';\n\nexport const StyledDrawer = styled.div<Partial<DrawerProps & { state: State }>>(props => {\n const { state, shadow, position, placement, transitionSpeed, size, resizeable, theme } = props;\n let dimension = 'horizontal';\n let axis = 'X';\n let anchor = 'top';\n\n if (placement === 'top' || placement === 'bottom') {\n dimension = 'vertical';\n axis = 'Y';\n anchor = 'left';\n }\n\n const translate = state === 'open' || state === 'opening' ? 0 : '100%';\n const speed = transitionSpeed || theme.base.animation.speed;\n\n return css`\n z-index: ${theme.base['z-index'].drawer};\n position: ${position};\n ${placement}: 0;\n ${anchor}: 0;\n height: ${dimension === 'vertical' ? size : '100%'};\n width: ${dimension === 'horizontal' ? size : '100%'};\n transition-property: transform, box-shadow, opacity;\n transition-duration: max(${speed}, 0.0001s);\n transition-timing-function: ${theme.base.animation.timing.ease};\n transform: ${state === 'open'\n ? 'none'\n : `translate${axis}(${placement === 'top' || placement === 'left' ? '-' : ''}${translate})`};\n\n ${shadow &&\n css`\n box-shadow: ${theme.base.shadow.high};\n `}\n\n ${resizeable &&\n css`\n width: ${dimension === 'horizontal' ? 'var(--resize-drawer-width)' : '100%'};\n `}\n `;\n});\n\nStyledDrawer.defaultProps = defaultThemeProp;\n\nexport const Drawer: FunctionComponent<DrawerProps & ForwardProps> = forwardRef(function Drawer(\n props: DrawerProps,\n ref: Ref<HTMLElement>\n) {\n const {\n open = false,\n shadow = false,\n position = 'absolute',\n children,\n placement = 'right',\n transitionSpeed,\n size = '100%',\n resizeable = false,\n onAfterOpen,\n onAfterClose,\n onBeforeOpen,\n onBeforeClose,\n onOuterClick,\n nullWhenClosed = false,\n ...restProps\n } = props;\n\n const drawerRef = useConsolidatedRef(ref);\n const { ltr, rtl } = useDirection();\n\n const [state, setState] = useState<State>(open ? 'open' : 'closed');\n\n let prevState = usePrevious(state);\n if (!prevState) prevState = state;\n\n useOuterEvent(\n 'mousedown',\n [drawerRef],\n useCallback(() => {\n if (open) onOuterClick?.();\n }, [open, onOuterClick])\n );\n\n useEffect(() => {\n if (open && (state === 'closed' || state === 'closing')) {\n onBeforeOpen?.();\n reflow(drawerRef.current);\n setState('opening');\n } else if (!open && (state === 'open' || state === 'opening')) {\n onBeforeClose?.();\n setState('closing');\n } else if (open && state === 'open' && prevState !== 'open') {\n onAfterOpen?.();\n } else if (!open && state === 'closed' && prevState !== 'closed') {\n onAfterClose?.();\n }\n }, [open, state, prevState, onBeforeOpen, onBeforeClose, onAfterOpen, onAfterClose]);\n\n const onTransitionEnd = useCallback(\n (e: TransitionEvent): void => {\n if (e.target !== drawerRef.current || e.propertyName !== 'transform') return;\n setState(open ? 'open' : 'closed');\n },\n [open]\n );\n\n const dragStartXRef = useRef<number>();\n\n useEffect(() => {\n const targetNode = getChildOfRootNode(drawerRef);\n if (!targetNode) return;\n if (!targetNode.style.getPropertyValue('--resize-drawer-width')) {\n targetNode.style.setProperty('--resize-drawer-width', size);\n }\n }, [drawerRef.current]);\n\n const handleResize = useCallback(\n (e: ReactMouseEvent) => {\n const targetNode = getChildOfRootNode(drawerRef);\n const rect = drawerRef.current?.getBoundingClientRect();\n if (!rect || !targetNode) return;\n\n dragStartXRef.current = e.clientX;\n\n const ac = new AbortController();\n targetNode.addEventListener(\n 'mousemove',\n moveEvent => {\n if (!dragStartXRef.current || !rect.width) return;\n\n const initialX = dragStartXRef.current;\n const widthDiff =\n placement === 'right' ? initialX - moveEvent.clientX : moveEvent.clientX - initialX;\n\n const newWidth = Math.max(widthDiff + rect.width, parseInt(drawerMinWidth, 10));\n\n // Set root-level CSS variable to communicate width to AppShell\n targetNode.style.setProperty(\n '--resize-drawer-width',\n `clamp(${drawerMinWidth}, ${newWidth}px, ${resizeDrawerMaxWidth})`\n );\n },\n { passive: true, signal: ac.signal }\n );\n\n targetNode.addEventListener(\n 'mouseup',\n () => {\n ac.abort();\n },\n { once: true }\n );\n },\n [placement]\n );\n\n const keyboardResize = useCallback(\n (e: ReactKeyboardEvent, grabbed: boolean) => {\n if (!grabbed) return;\n const targetNode = getChildOfRootNode(drawerRef);\n const resizeStep = document.documentElement.clientWidth * resizeDrawerKeyboardStep;\n const rect = drawerRef.current?.getBoundingClientRect();\n if (!rect || !targetNode) return;\n if (e.code !== 'ArrowLeft' && e.code !== 'ArrowRight') return;\n e.preventDefault();\n\n const resizeDirection = (e.code === 'ArrowLeft' ? 1 : -1) * (placement === 'right' ? 1 : -1);\n\n const newWidth = Math.max(\n rect.width + resizeDirection * resizeStep,\n parseInt(drawerMinWidth, 10)\n );\n targetNode.style.setProperty(\n '--resize-drawer-width',\n `clamp(${drawerMinWidth}, ${newWidth}px, ${resizeDrawerMaxWidth})`\n );\n },\n [placement]\n );\n\n const renderResizeHandle =\n resizeable &&\n state === 'open' &&\n ((placement === 'left' && rtl) || (placement === 'right' && ltr));\n\n return state === 'closed' && !open && nullWhenClosed ? null : (\n <StyledDrawer\n ref={drawerRef}\n position={position}\n shadow={shadow && open}\n transitionSpeed={transitionSpeed}\n placement={placement}\n size={size}\n resizeable={resizeable}\n open={open}\n state={state}\n onTransitionEnd={onTransitionEnd}\n {...restProps}\n >\n {children}\n {renderResizeHandle && <ResizeHandle onMouseDown={handleResize} onKeyDown={keyboardResize} />}\n </StyledDrawer>\n );\n});\n\nexport default Drawer;\n"]}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import type { MouseEvent as ReactMouseEvent, KeyboardEvent as ReactKeyboardEvent } from 'react';
|
|
2
|
+
export interface ResizeHandleProps {
|
|
3
|
+
onKeyDown: (e: ReactKeyboardEvent, grabbed: boolean) => void;
|
|
4
|
+
onMouseDown: (e: ReactMouseEvent) => void;
|
|
5
|
+
}
|
|
6
|
+
export declare const StyledResizeHandle: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
7
|
+
declare const ResizeHandle: import("react").ForwardRefExoticComponent<ResizeHandleProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
8
|
+
export default ResizeHandle;
|
|
9
|
+
//# sourceMappingURL=ResizeHandle.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ResizeHandle.d.ts","sourceRoot":"","sources":["../../../src/components/Drawer/ResizeHandle.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAGV,UAAU,IAAI,eAAe,EAC7B,aAAa,IAAI,kBAAkB,EACpC,MAAM,OAAO,CAAC;AAef,MAAM,WAAW,iBAAiB;IAChC,SAAS,EAAE,CAAC,CAAC,EAAE,kBAAkB,EAAE,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7D,WAAW,EAAE,CAAC,CAAC,EAAE,eAAe,KAAK,IAAI,CAAC;CAC3C;AAyBD,eAAO,MAAM,kBAAkB,yGA8B7B,CAAC;AAIH,QAAA,MAAM,YAAY,8GAqEhB,CAAC;AAEH,eAAe,YAAY,CAAC"}
|
|
@@ -0,0 +1,109 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef, useState } from 'react';
|
|
3
|
+
import styled, { css } from 'styled-components';
|
|
4
|
+
import { hideVisually } from 'polished';
|
|
5
|
+
import Button, { StyledButton } from '../Button';
|
|
6
|
+
import Icon, { registerIcon, StyledIcon } from '../Icon';
|
|
7
|
+
import { useConsolidatedRef, useEscape, useI18n } from '../../hooks';
|
|
8
|
+
import { getChildOfRootNode } from '../../utils';
|
|
9
|
+
import { defaultThemeProp } from '../../theme';
|
|
10
|
+
import * as DragIcon from '../Icon/icons/drag.icon';
|
|
11
|
+
import * as ArrowUpDownIcon from '../Icon/icons/arrow-micro-up-down.icon';
|
|
12
|
+
registerIcon(DragIcon);
|
|
13
|
+
registerIcon(ArrowUpDownIcon);
|
|
14
|
+
const StyledResizeButton = styled(Button)(({ rotateIcon }) => {
|
|
15
|
+
return css `
|
|
16
|
+
cursor: grab;
|
|
17
|
+
|
|
18
|
+
&:active {
|
|
19
|
+
cursor: grabbing;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
&:not(:focus) {
|
|
23
|
+
${hideVisually};
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
${rotateIcon &&
|
|
27
|
+
css `
|
|
28
|
+
${StyledIcon} {
|
|
29
|
+
transform: rotate(90deg);
|
|
30
|
+
}
|
|
31
|
+
`}
|
|
32
|
+
`;
|
|
33
|
+
});
|
|
34
|
+
export const StyledResizeHandle = styled.div(({ theme }) => {
|
|
35
|
+
return css `
|
|
36
|
+
position: absolute;
|
|
37
|
+
inset-inline-start: 0;
|
|
38
|
+
inset-block: 0;
|
|
39
|
+
inline-size: 0.125rem;
|
|
40
|
+
background-color: transparent;
|
|
41
|
+
transition: background-color ${theme.base.animation.speed} ${theme.base.animation.timing.ease};
|
|
42
|
+
cursor: ew-resize;
|
|
43
|
+
z-index: ${theme.base['z-index'].max};
|
|
44
|
+
|
|
45
|
+
::before {
|
|
46
|
+
content: '';
|
|
47
|
+
position: absolute;
|
|
48
|
+
inset: 0;
|
|
49
|
+
width: calc(${theme.base['hit-area'].compact} * 0.75);
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
&:hover {
|
|
53
|
+
background-color: ${theme.base.palette.interactive};
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
${StyledButton} {
|
|
57
|
+
position: absolute;
|
|
58
|
+
inset-block-start: 50%;
|
|
59
|
+
inset-inline-start: calc(-2 * ${theme.base.spacing});
|
|
60
|
+
translate: 0 -50%;
|
|
61
|
+
box-shadow: ${theme.base.shadow.focus};
|
|
62
|
+
}
|
|
63
|
+
`;
|
|
64
|
+
});
|
|
65
|
+
StyledResizeHandle.defaultProps = defaultThemeProp;
|
|
66
|
+
const ResizeHandle = forwardRef(function ResizeHandle({ onMouseDown, onKeyDown }, ref) {
|
|
67
|
+
const resizeHandleRef = useConsolidatedRef(ref);
|
|
68
|
+
const t = useI18n();
|
|
69
|
+
const [mouseGrabbed, setMouseGrabbed] = useState(false);
|
|
70
|
+
const [keyboardGrabbed, setKeyboardGrabbed] = useState(false);
|
|
71
|
+
useEscape(() => {
|
|
72
|
+
setMouseGrabbed(false);
|
|
73
|
+
setKeyboardGrabbed(false);
|
|
74
|
+
});
|
|
75
|
+
const handleKeyDown = (e) => {
|
|
76
|
+
if (e.code === 'Space') {
|
|
77
|
+
e.preventDefault();
|
|
78
|
+
if (keyboardGrabbed) {
|
|
79
|
+
setKeyboardGrabbed(false);
|
|
80
|
+
}
|
|
81
|
+
else {
|
|
82
|
+
setKeyboardGrabbed(true);
|
|
83
|
+
}
|
|
84
|
+
}
|
|
85
|
+
onKeyDown?.(e, keyboardGrabbed);
|
|
86
|
+
};
|
|
87
|
+
const handleMouseDown = (e) => {
|
|
88
|
+
const targetNode = getChildOfRootNode(resizeHandleRef);
|
|
89
|
+
if (!targetNode)
|
|
90
|
+
return;
|
|
91
|
+
targetNode.style.setProperty('user-select', 'none');
|
|
92
|
+
setMouseGrabbed(true);
|
|
93
|
+
onMouseDown?.(e);
|
|
94
|
+
};
|
|
95
|
+
const handleMouseUp = () => {
|
|
96
|
+
const targetNode = getChildOfRootNode(resizeHandleRef);
|
|
97
|
+
if (!targetNode)
|
|
98
|
+
return;
|
|
99
|
+
targetNode.style.removeProperty('user-select');
|
|
100
|
+
setMouseGrabbed(false);
|
|
101
|
+
};
|
|
102
|
+
return (_jsx(StyledResizeHandle, { onMouseDown: handleMouseDown, onMouseUp: handleMouseUp, ref: resizeHandleRef, children: _jsx(StyledResizeButton, { tabIndex: 0, icon: true, label: !mouseGrabbed && !keyboardGrabbed ? t('resize') : undefined, "aria-label": !mouseGrabbed && !keyboardGrabbed
|
|
103
|
+
? t('drag_handle_activate_description')
|
|
104
|
+
: t('drag_handle_cancel_description'), onMouseDown: handleMouseDown, onKeyDown: handleKeyDown, onBlur: () => {
|
|
105
|
+
setKeyboardGrabbed(false);
|
|
106
|
+
}, rotateIcon: keyboardGrabbed, children: _jsx(Icon, { name: keyboardGrabbed ? 'arrow-micro-up-down' : 'drag' }) }) }));
|
|
107
|
+
});
|
|
108
|
+
export default ResizeHandle;
|
|
109
|
+
//# sourceMappingURL=ResizeHandle.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ResizeHandle.js","sourceRoot":"","sources":["../../../src/components/Drawer/ResizeHandle.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useState } from 'react';\nimport type {\n PropsWithoutRef,\n Ref,\n MouseEvent as ReactMouseEvent,\n KeyboardEvent as ReactKeyboardEvent\n} from 'react';\nimport styled, { css } from 'styled-components';\nimport { hideVisually } from 'polished';\n\nimport Button, { StyledButton } from '../Button';\nimport Icon, { registerIcon, StyledIcon } from '../Icon';\nimport { useConsolidatedRef, useEscape, useI18n } from '../../hooks';\nimport { getChildOfRootNode } from '../../utils';\nimport { defaultThemeProp } from '../../theme';\nimport * as DragIcon from '../Icon/icons/drag.icon';\nimport * as ArrowUpDownIcon from '../Icon/icons/arrow-micro-up-down.icon';\n\nregisterIcon(DragIcon);\nregisterIcon(ArrowUpDownIcon);\n\nexport interface ResizeHandleProps {\n onKeyDown: (e: ReactKeyboardEvent, grabbed: boolean) => void;\n onMouseDown: (e: ReactMouseEvent) => void;\n}\n\nconst StyledResizeButton = styled(Button)<{\n rotateIcon?: boolean;\n}>(({ rotateIcon }) => {\n return css`\n cursor: grab;\n\n &:active {\n cursor: grabbing;\n }\n\n &:not(:focus) {\n ${hideVisually};\n }\n\n ${rotateIcon &&\n css`\n ${StyledIcon} {\n transform: rotate(90deg);\n }\n `}\n `;\n});\n\nexport const StyledResizeHandle = styled.div(({ theme }) => {\n return css`\n position: absolute;\n inset-inline-start: 0;\n inset-block: 0;\n inline-size: 0.125rem;\n background-color: transparent;\n transition: background-color ${theme.base.animation.speed} ${theme.base.animation.timing.ease};\n cursor: ew-resize;\n z-index: ${theme.base['z-index'].max};\n\n ::before {\n content: '';\n position: absolute;\n inset: 0;\n width: calc(${theme.base['hit-area'].compact} * 0.75);\n }\n\n &:hover {\n background-color: ${theme.base.palette.interactive};\n }\n\n ${StyledButton} {\n position: absolute;\n inset-block-start: 50%;\n inset-inline-start: calc(-2 * ${theme.base.spacing});\n translate: 0 -50%;\n box-shadow: ${theme.base.shadow.focus};\n }\n `;\n});\n\nStyledResizeHandle.defaultProps = defaultThemeProp;\n\nconst ResizeHandle = forwardRef(function ResizeHandle(\n { onMouseDown, onKeyDown }: PropsWithoutRef<ResizeHandleProps>,\n ref: Ref<HTMLDivElement>\n) {\n const resizeHandleRef = useConsolidatedRef<HTMLDivElement>(ref);\n const t = useI18n();\n\n const [mouseGrabbed, setMouseGrabbed] = useState(false);\n const [keyboardGrabbed, setKeyboardGrabbed] = useState(false);\n\n useEscape(() => {\n setMouseGrabbed(false);\n setKeyboardGrabbed(false);\n });\n\n const handleKeyDown = (e: ReactKeyboardEvent) => {\n if (e.code === 'Space') {\n e.preventDefault();\n if (keyboardGrabbed) {\n setKeyboardGrabbed(false);\n } else {\n setKeyboardGrabbed(true);\n }\n }\n\n onKeyDown?.(e, keyboardGrabbed);\n };\n\n const handleMouseDown = (e: ReactMouseEvent) => {\n const targetNode = getChildOfRootNode(resizeHandleRef);\n if (!targetNode) return;\n targetNode.style.setProperty('user-select', 'none');\n setMouseGrabbed(true);\n onMouseDown?.(e);\n };\n\n const handleMouseUp = () => {\n const targetNode = getChildOfRootNode(resizeHandleRef);\n if (!targetNode) return;\n targetNode.style.removeProperty('user-select');\n setMouseGrabbed(false);\n };\n\n return (\n <StyledResizeHandle\n onMouseDown={handleMouseDown}\n onMouseUp={handleMouseUp}\n ref={resizeHandleRef}\n >\n <StyledResizeButton\n tabIndex={0}\n icon\n label={!mouseGrabbed && !keyboardGrabbed ? t('resize') : undefined}\n aria-label={\n !mouseGrabbed && !keyboardGrabbed\n ? t('drag_handle_activate_description')\n : t('drag_handle_cancel_description')\n }\n onMouseDown={handleMouseDown}\n onKeyDown={handleKeyDown}\n onBlur={() => {\n setKeyboardGrabbed(false);\n }}\n rotateIcon={keyboardGrabbed}\n >\n <Icon name={keyboardGrabbed ? 'arrow-micro-up-down' : 'drag'} />\n </StyledResizeButton>\n </StyledResizeHandle>\n );\n});\n\nexport default ResizeHandle;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Drawer/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AACjD,YAAY,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Drawer/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,YAAY,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAC5C,YAAY,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Drawer/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC","sourcesContent":["export { default, StyledDrawer } from './Drawer';\nexport type { DrawerProps } from './Drawer';\n"]}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Drawer/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC","sourcesContent":["export { default, StyledDrawer } from './Drawer';\nexport { default as ResizeHandle } from './ResizeHandle';\nexport type { DrawerProps } from './Drawer';\nexport type { ResizeHandleProps } from './ResizeHandle';\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FieldValueList.d.ts","sourceRoot":"","sources":["../../../src/components/FieldValueList/FieldValueList.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,iBAAiB,EAAO,MAAM,OAAO,CAAC;AAG/D,OAAO,KAAK,EACV,SAAS,EACT,aAAa,EACb,YAAY,EACZ,cAAc,EACd,UAAU,EACX,MAAM,aAAa,CAAC;AAWrB,MAAM,MAAM,iBAAiB,GAAG,QAAQ,GAAG,SAAS,CAAC;AAErD,UAAU,sBAAuB,SAAQ,UAAU;IACjD,IAAI,EAAE,MAAM,CAAC;IACb,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,OAAO,CAAC,EAAE,iBAAiB,CAAC;CAC7B;AAED,MAAM,MAAM,uBAAuB,GAC/B,CAAC,sBAAsB,GAAG;IACxB,KAAK,CAAC,EAAE,aAAa,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAC;IAC3C,QAAQ,CAAC,EAAE,KAAK,CAAC;CAClB,CAAC,GACF,CAAC,sBAAsB,GAAG;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC,CAAC;AAEP,MAAM,WAAW,mBAAoB,SAAQ,SAAS,EAAE,cAAc,EAAE,UAAU;IAChF,qDAAqD;IACrD,MAAM,EAAE,uBAAuB,EAAE,CAAC;IAClC;;;OAGG;IACH,OAAO,CAAC,EAAE,iBAAiB,GAAG,kBAAkB,CAAC;CAClD;AAED,eAAO,MAAM,eAAe,wGAE3B,CAAC;AAEF,eAAO,MAAM,gBAAgB,wGAE5B,CAAC;AAEF,eAAO,MAAM,uBAAuB,yGAAe,CAAC;AAEpD,MAAM,MAAM,yBAAyB,GAAG,IAAI,CAAC,mBAAmB,EAAE,SAAS,CAAC,CAAC;AAE7E,eAAO,MAAM,oBAAoB,+
|
|
1
|
+
{"version":3,"file":"FieldValueList.d.ts","sourceRoot":"","sources":["../../../src/components/FieldValueList/FieldValueList.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,iBAAiB,EAAO,MAAM,OAAO,CAAC;AAG/D,OAAO,KAAK,EACV,SAAS,EACT,aAAa,EACb,YAAY,EACZ,cAAc,EACd,UAAU,EACX,MAAM,aAAa,CAAC;AAWrB,MAAM,MAAM,iBAAiB,GAAG,QAAQ,GAAG,SAAS,CAAC;AAErD,UAAU,sBAAuB,SAAQ,UAAU;IACjD,IAAI,EAAE,MAAM,CAAC;IACb,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,OAAO,CAAC,EAAE,iBAAiB,CAAC;CAC7B;AAED,MAAM,MAAM,uBAAuB,GAC/B,CAAC,sBAAsB,GAAG;IACxB,KAAK,CAAC,EAAE,aAAa,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAC;IAC3C,QAAQ,CAAC,EAAE,KAAK,CAAC;CAClB,CAAC,GACF,CAAC,sBAAsB,GAAG;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC,CAAC;AAEP,MAAM,WAAW,mBAAoB,SAAQ,SAAS,EAAE,cAAc,EAAE,UAAU;IAChF,qDAAqD;IACrD,MAAM,EAAE,uBAAuB,EAAE,CAAC;IAClC;;;OAGG;IACH,OAAO,CAAC,EAAE,iBAAiB,GAAG,kBAAkB,CAAC;CAClD;AAED,eAAO,MAAM,eAAe,wGAE3B,CAAC;AAEF,eAAO,MAAM,gBAAgB,wGAE5B,CAAC;AAEF,eAAO,MAAM,uBAAuB,yGAAe,CAAC;AAEpD,MAAM,MAAM,yBAAyB,GAAG,IAAI,CAAC,mBAAmB,EAAE,SAAS,CAAC,CAAC;AAE7E,eAAO,MAAM,oBAAoB,+HAmD/B,CAAC;AAIH,eAAO,MAAM,cAAc,gDACsC,uBAAuB;;CA4BvF,CAAC;;;;AA8DF,wBAAqE"}
|
|
@@ -52,7 +52,10 @@ export const StyledFieldValueList = styled.dl(({ variant, theme }) => {
|
|
|
52
52
|
}
|
|
53
53
|
dd:not(:last-of-type),
|
|
54
54
|
dt:not(:last-of-type),
|
|
55
|
-
${StyledStackedFieldValue}
|
|
55
|
+
dd:has(+ ${StyledStackedFieldValue}),
|
|
56
|
+
dt:has(+ dd + ${StyledStackedFieldValue}),
|
|
57
|
+
${StyledStackedFieldValue}:has(+ dt + dd),
|
|
58
|
+
${StyledStackedFieldValue}:not(:last-of-type) {
|
|
56
59
|
border-bottom: 0.0625rem dashed ${theme.base.palette['border-line']};
|
|
57
60
|
padding-bottom: calc(0.5 * ${theme.base.spacing});
|
|
58
61
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FieldValueList.js","sourceRoot":"","sources":["../../../src/components/FieldValueList/FieldValueList.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAShD,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,kBAAkB,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACtF,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,YAAY,MAAM,iBAAiB,CAAC;AAC3C,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,OAAO,MAAM,oBAAoB,CAAC;AAEzC,OAAO,EAAE,wBAAwB,EAAE,wBAAwB,EAAE,MAAM,2BAA2B,CAAC;AA8B/F,MAAM,CAAC,MAAM,eAAe,GAAG,MAAM,CAAC,EAAE,CAAA;;CAEvC,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,EAAE,CAAA;;CAExC,CAAC;AAEF,MAAM,CAAC,MAAM,uBAAuB,GAAG,MAAM,CAAC,GAAG,CAAA,EAAE,CAAC;AAIpD,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,EAAE,CAA4B,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,EAAE;IAC9F,MAAM,EACJ,UAAU,EAAE,EACV,kBAAkB,EAAE,EAClB,MAAM,EAAE,EAAE,QAAQ,EAAE,EACrB,EACF,EACF,GAAG,KAAK,CAAC;IACV,OAAO,GAAG,CAAA;;;MAGN,OAAO,KAAK,kBAAkB;QAChC,GAAG,CAAA;;;;;;yCAMkC,KAAK,CAAC,IAAI,CAAC,OAAO;;QAEnD,WAAW;;;;;yCAKsB,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC;qCACrC,KAAK,CAAC,IAAI,CAAC,OAAO;;KAElD;;MAEC,QAAQ;QACV,OAAO,KAAK,QAAQ;QACpB,GAAG,CAAA;;;mCAG4B,KAAK,CAAC,IAAI,CAAC,OAAO;;QAE7C,WAAW;;;;;
|
|
1
|
+
{"version":3,"file":"FieldValueList.js","sourceRoot":"","sources":["../../../src/components/FieldValueList/FieldValueList.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAShD,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,kBAAkB,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACtF,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,YAAY,MAAM,iBAAiB,CAAC;AAC3C,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,OAAO,MAAM,oBAAoB,CAAC;AAEzC,OAAO,EAAE,wBAAwB,EAAE,wBAAwB,EAAE,MAAM,2BAA2B,CAAC;AA8B/F,MAAM,CAAC,MAAM,eAAe,GAAG,MAAM,CAAC,EAAE,CAAA;;CAEvC,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,EAAE,CAAA;;CAExC,CAAC;AAEF,MAAM,CAAC,MAAM,uBAAuB,GAAG,MAAM,CAAC,GAAG,CAAA,EAAE,CAAC;AAIpD,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,EAAE,CAA4B,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,EAAE;IAC9F,MAAM,EACJ,UAAU,EAAE,EACV,kBAAkB,EAAE,EAClB,MAAM,EAAE,EAAE,QAAQ,EAAE,EACrB,EACF,EACF,GAAG,KAAK,CAAC;IACV,OAAO,GAAG,CAAA;;;MAGN,OAAO,KAAK,kBAAkB;QAChC,GAAG,CAAA;;;;;;yCAMkC,KAAK,CAAC,IAAI,CAAC,OAAO;;QAEnD,WAAW;;;;;yCAKsB,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC;qCACrC,KAAK,CAAC,IAAI,CAAC,OAAO;;KAElD;;MAEC,QAAQ;QACV,OAAO,KAAK,QAAQ;QACpB,GAAG,CAAA;;;mCAG4B,KAAK,CAAC,IAAI,CAAC,OAAO;;QAE7C,WAAW;;;;;iBAKF,uBAAuB;sBAClB,uBAAuB;QACrC,uBAAuB;QACvB,uBAAuB;0CACW,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC;qCACtC,KAAK,CAAC,IAAI,CAAC,OAAO;;KAElD;GACF,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,oBAAoB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAErD,MAAM,CAAC,MAAM,cAAc,GAAG,WAAW,CACvC,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,GAAG,QAAQ,EAAE,QAAQ,GAAG,IAAI,EAA2B,EAAE,EAAE;IACxF,MAAM,OAAO,GAAG,UAAU,CAAC,MAAM,EAAE,wBAAwB,CAAC,CAAC;IAE7D,MAAM,YAAY,GAChB,OAAO,KAAK,KAAK,QAAQ,IAAI,QAAQ,CAAC,CAAC,CAAC,CACtC,KAAC,YAAY,IAAC,KAAK,EAAE,CAAC,YAAG,KAAK,GAAgB,CAC/C,CAAC,CAAC,CAAC,CACF,KAAK,CACN,CAAC;IAEJ,MAAM,aAAa,GAAG,CACpB,8BACE,KAAC,WAAW,mBAAc,OAAO,CAAC,IAAI,EAAE,EAAE,EAAE,eAAe,YACxD,IAAI,GACO,EACd,KAAC,gBAAgB,mBAAc,OAAO,CAAC,KAAK,YACzC,KAAK,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,KAAC,OAAO,KAAG,GAClB,IAClB,CACJ,CAAC;IAEF,OAAO,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,CAC7B,KAAC,uBAAuB,mBAAc,OAAO,CAAC,IAAI,YAAG,aAAa,GAA2B,CAC9F,CAAC,CAAC,CAAC,CACF,4BAAG,aAAa,GAAI,CACrB,CAAC;AACJ,CAAC,EACD,wBAAwB,CACzB,CAAC;AAEF,MAAM,cAAc,GAA0D,UAAU,CACtF,SAAS,cAAc,CACrB,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,GAAG,QAAQ,EAAE,GAAG,SAAS,EAAuB,EACzE,GAAwB;IAExB,MAAM,OAAO,GAAG,UAAU,CAAC,MAAM,EAAE,wBAAwB,CAAC,CAAC;IAE7D,MAAM,iBAAiB,GAAG,kBAAkB,CAAiB,GAAG,CAAC,CAAC;IAElE,MAAM,uBAAuB,GAAG,aAAa,CAAC,IAAI,EAAE;QAClD,aAAa,EAAE,iBAAiB;QAChC,SAAS,EAAE,eAAe;KAC3B,CAAC,CAAC;IAEH,MAAM,EACJ,UAAU,EAAE,EACV,kBAAkB,EAAE,EAClB,MAAM,EAAE,EAAE,QAAQ,EAAE,EACrB,EACF,EACF,GAAG,QAAQ,EAAE,CAAC;IAEf,OAAO,CACL,KAAC,IAAI,mBACU,OAAO,CAAC,IAAI,KACrB,SAAS,EACb,GAAG,EAAE,iBAAiB,EACtB,SAAS,EAAE;YACT,IAAI,EACF,CAAC,QAAQ,EAAE,kBAAkB,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,uBAAuB;gBACzE,CAAC,CAAC,qBAAqB;gBACvB,CAAC,CAAC,gBAAgB;YACtB,MAAM,EAAE,CAAC,QAAQ,IAAI,OAAO,KAAK,kBAAkB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;YAC3D,MAAM,EAAE,CAAC,QAAQ,IAAI,OAAO,KAAK,kBAAkB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG;SAC9D,EACD,EAAE,EAAE,oBAAoB,EACxB,OAAO,EAAE,uBAAuB,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,YAErD,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,QAAQ,GAAG,IAAI,EAAE,OAAO,EAAE,YAAY,EAAE,EAAE,EAAE;YAC1E,MAAM,WAAW,GAA2B;gBAC1C,IAAI;gBACJ,OAAO,EACL,CAAC,YAAY,IAAI,OAAO,CAAC,KAAK,SAAS,IAAI,CAAC,uBAAuB;oBACjE,CAAC,CAAC,SAAS;oBACX,CAAC,CAAC,QAAQ;aACf,CAAC;YAEF,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE,CAAC;gBAC9B,OAAO,CACL,KAAC,cAAc,OAAsB,WAAW,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,IAA7D,EAAE,IAAI,IAAI,CAAuD,CACvF,CAAC;YACJ,CAAC;YAED,OAAO,KAAC,cAAc,OAAsB,WAAW,EAAE,KAAK,EAAE,KAAK,IAAzC,EAAE,IAAI,IAAI,CAAmC,CAAC;QAC5E,CAAC,CAAC,GACG,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,WAAW,CAAC,cAAc,EAAE,wBAAwB,CAAC,CAAC","sourcesContent":["import { forwardRef } from 'react';\nimport type { ReactNode, FunctionComponent, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport type {\n BaseProps,\n ExcludeStrict,\n ForwardProps,\n NoChildrenProp,\n TestIdProp\n} from '../../types';\nimport Grid from '../Grid';\nimport { StyledLabel } from '../Label';\nimport { useBreakpoint, useConsolidatedRef, useTestIds, useTheme } from '../../hooks';\nimport { defaultThemeProp } from '../../theme';\nimport ShowMoreLess from '../ShowMoreLess';\nimport { withTestIds } from '../../utils';\nimport NoValue from '../NoValue/NoValue';\n\nimport { getFieldValueListTestIds, getFieldValueItemTestIds } from './FieldValueList.test-ids';\n\nexport type FieldValueVariant = 'inline' | 'stacked';\n\ninterface BaseFieldValueListItem extends TestIdProp {\n name: string;\n id?: string;\n variant?: FieldValueVariant;\n}\n\nexport type FieldValueListItemProps =\n | (BaseFieldValueListItem & {\n value?: ExcludeStrict<ReactNode, 'string'>;\n truncate?: never;\n })\n | (BaseFieldValueListItem & {\n value: string;\n truncate?: boolean;\n });\n\nexport interface FieldValueListProps extends BaseProps, NoChildrenProp, TestIdProp {\n /** The set of field values to render in the list. */\n fields: FieldValueListItemProps[];\n /**\n * Determines if the field and values should be displayed on the same line, or stacked with the field above the value.\n * @default 'inline'\n */\n variant?: FieldValueVariant | 'value-comparison';\n}\n\nexport const StyledFieldName = styled.dt`\n word-break: break-word;\n`;\n\nexport const StyledFieldValue = styled.dd`\n word-break: break-word;\n`;\n\nexport const StyledStackedFieldValue = styled.div``;\n\nexport type StyledFieldValueListProps = Pick<FieldValueListProps, 'variant'>;\n\nexport const StyledFieldValueList = styled.dl<StyledFieldValueListProps>(({ variant, theme }) => {\n const {\n components: {\n 'field-value-list': {\n inline: { detached }\n }\n }\n } = theme;\n return css`\n width: 100%;\n\n ${variant === 'value-comparison' &&\n css`\n dt {\n width: 100%;\n }\n dd {\n text-align: end;\n padding-inline-start: calc(2 * ${theme.base.spacing});\n }\n ${StyledLabel} {\n max-width: unset;\n }\n dd:not(:last-of-type),\n dt:not(:last-of-type) {\n border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};\n padding-bottom: calc(0.5 * ${theme.base.spacing});\n }\n `}\n\n ${detached &&\n variant === 'inline' &&\n css`\n dt {\n width: 100%;\n padding-inline-end: calc(${theme.base.spacing});\n }\n ${StyledLabel} {\n max-width: unset;\n }\n dd:not(:last-of-type),\n dt:not(:last-of-type),\n dd:has(+ ${StyledStackedFieldValue}),\n dt:has(+ dd + ${StyledStackedFieldValue}),\n ${StyledStackedFieldValue}:has(+ dt + dd),\n ${StyledStackedFieldValue}:not(:last-of-type) {\n border-bottom: 0.0625rem dashed ${theme.base.palette['border-line']};\n padding-bottom: calc(0.5 * ${theme.base.spacing});\n }\n `}\n `;\n});\n\nStyledFieldValueList.defaultProps = defaultThemeProp;\n\nexport const FieldValueItem = withTestIds(\n ({ testId, name, value, variant = 'inline', truncate = true }: FieldValueListItemProps) => {\n const testIds = useTestIds(testId, getFieldValueItemTestIds);\n\n const displayValue =\n typeof value === 'string' && truncate ? (\n <ShowMoreLess lines={3}>{value}</ShowMoreLess>\n ) : (\n value\n );\n\n const labelAndValue = (\n <>\n <StyledLabel data-testid={testIds.name} as={StyledFieldName}>\n {name}\n </StyledLabel>\n <StyledFieldValue data-testid={testIds.value}>\n {value ? displayValue : <NoValue />}\n </StyledFieldValue>\n </>\n );\n\n return variant === 'stacked' ? (\n <StyledStackedFieldValue data-testid={testIds.root}>{labelAndValue}</StyledStackedFieldValue>\n ) : (\n <>{labelAndValue}</>\n );\n },\n getFieldValueItemTestIds\n);\n\nconst FieldValueList: FunctionComponent<FieldValueListProps & ForwardProps> = forwardRef(\n function FieldValueList(\n { testId, fields, variant = 'inline', ...restProps }: FieldValueListProps,\n ref: Ref<HTMLDivElement>\n ) {\n const testIds = useTestIds(testId, getFieldValueListTestIds);\n\n const fieldValueListRef = useConsolidatedRef<HTMLDivElement>(ref);\n\n const isXSContentWidthOrAbove = useBreakpoint('xs', {\n breakpointRef: fieldValueListRef,\n themeProp: 'content-width'\n });\n\n const {\n components: {\n 'field-value-list': {\n inline: { detached }\n }\n }\n } = useTheme();\n\n return (\n <Grid\n data-testid={testIds.root}\n {...restProps}\n ref={fieldValueListRef}\n container={{\n cols:\n ['inline', 'value-comparison'].includes(variant) && isXSContentWidthOrAbove\n ? '16ch minmax(0, 1fr)'\n : 'minmax(0, 1fr)',\n colGap: !detached && variant !== 'value-comparison' ? 2 : 0,\n rowGap: !detached && variant !== 'value-comparison' ? 1 : 0.5\n }}\n as={StyledFieldValueList}\n variant={isXSContentWidthOrAbove ? variant : 'stacked'}\n >\n {fields.map(({ id, name, value, truncate = true, variant: fieldVariant }) => {\n const sharedProps: BaseFieldValueListItem = {\n name,\n variant:\n (fieldVariant ?? variant) === 'stacked' || !isXSContentWidthOrAbove\n ? 'stacked'\n : 'inline'\n };\n\n if (typeof value === 'string') {\n return (\n <FieldValueItem key={id ?? name} {...sharedProps} value={value} truncate={truncate} />\n );\n }\n\n return <FieldValueItem key={id ?? name} {...sharedProps} value={value} />;\n })}\n </Grid>\n );\n }\n);\n\nexport default withTestIds(FieldValueList, getFieldValueListTestIds);\n"]}
|
package/lib/hooks/useI18n.d.ts
CHANGED
|
@@ -18,6 +18,7 @@ declare const useI18n: () => import("../i18n/translate").TranslationFunction<Rea
|
|
|
18
18
|
select_placeholder_default: string;
|
|
19
19
|
description: string;
|
|
20
20
|
all: string;
|
|
21
|
+
any: string;
|
|
21
22
|
default: string;
|
|
22
23
|
app_default: string;
|
|
23
24
|
sitewide: string;
|
|
@@ -92,6 +93,7 @@ declare const useI18n: () => import("../i18n/translate").TranslationFunction<Rea
|
|
|
92
93
|
dismiss: string;
|
|
93
94
|
due: string;
|
|
94
95
|
drag: string;
|
|
96
|
+
resize: string;
|
|
95
97
|
reset: string;
|
|
96
98
|
refresh: string;
|
|
97
99
|
copy: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useI18n.d.ts","sourceRoot":"","sources":["../../src/hooks/useI18n.ts"],"names":[],"mappings":"AAMA;;;GAGG;AACH,QAAA,MAAM,OAAO
|
|
1
|
+
{"version":3,"file":"useI18n.d.ts","sourceRoot":"","sources":["../../src/hooks/useI18n.ts"],"names":[],"mappings":"AAMA;;;GAGG;AACH,QAAA,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAGZ,CAAC;AAEF,eAAe,OAAO,CAAC"}
|
package/lib/i18n/default.d.ts
CHANGED
|
@@ -14,6 +14,7 @@ declare const _default: {
|
|
|
14
14
|
select_placeholder_default: string;
|
|
15
15
|
description: string;
|
|
16
16
|
all: string;
|
|
17
|
+
any: string;
|
|
17
18
|
default: string;
|
|
18
19
|
app_default: string;
|
|
19
20
|
sitewide: string;
|
|
@@ -88,6 +89,7 @@ declare const _default: {
|
|
|
88
89
|
dismiss: string;
|
|
89
90
|
due: string;
|
|
90
91
|
drag: string;
|
|
92
|
+
resize: string;
|
|
91
93
|
reset: string;
|
|
92
94
|
refresh: string;
|
|
93
95
|
copy: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"default.d.ts","sourceRoot":"","sources":["../../src/i18n/default.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"default.d.ts","sourceRoot":"","sources":["../../src/i18n/default.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAu9CE,wBAAwB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAoMxB,uCAAuC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA3pDzC,wBAgsDE"}
|
package/lib/i18n/default.js
CHANGED
|
@@ -18,6 +18,7 @@ export default {
|
|
|
18
18
|
select_placeholder_default: 'Select…',
|
|
19
19
|
description: 'Description',
|
|
20
20
|
all: 'All',
|
|
21
|
+
any: 'Any',
|
|
21
22
|
default: 'default',
|
|
22
23
|
app_default: 'app default',
|
|
23
24
|
sitewide: 'Sitewide',
|
|
@@ -93,6 +94,7 @@ export default {
|
|
|
93
94
|
dismiss: 'Dismiss',
|
|
94
95
|
due: 'Due',
|
|
95
96
|
drag: 'Drag',
|
|
97
|
+
resize: 'Resize',
|
|
96
98
|
reset: 'Reset',
|
|
97
99
|
refresh: 'Refresh',
|
|
98
100
|
copy: 'Copy',
|