@activecollab/components 2.0.441 → 2.0.443
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/dist/cjs/components/Dialog/Styles.js +1 -1
- package/dist/cjs/components/Dialog/Styles.js.map +1 -1
- package/dist/cjs/components/Overlay/Overlay.js +41 -2
- package/dist/cjs/components/Overlay/Overlay.js.map +1 -1
- package/dist/cjs/components/Overlay/Styles.js +4 -2
- package/dist/cjs/components/Overlay/Styles.js.map +1 -1
- package/dist/cjs/components/Overlay/overlayStack.js +48 -0
- package/dist/cjs/components/Overlay/overlayStack.js.map +1 -0
- package/dist/cjs/components/Sheet/Styles.js +1 -1
- package/dist/cjs/components/Sheet/Styles.js.map +1 -1
- package/dist/cjs/presentation/shared/UserDetailsDialog.js +125 -0
- package/dist/cjs/presentation/shared/UserDetailsDialog.js.map +1 -0
- package/dist/cjs/presentation/shared/index.js +15 -0
- package/dist/cjs/presentation/shared/index.js.map +1 -1
- package/dist/cjs/presentation/whiteboard/bottomDock.js +10 -3
- package/dist/cjs/presentation/whiteboard/bottomDock.js.map +1 -1
- package/dist/cjs/presentation/whiteboard/canvasElements.js +114 -25
- package/dist/cjs/presentation/whiteboard/canvasElements.js.map +1 -1
- package/dist/cjs/presentation/whiteboard/entityCardActions.js +79 -0
- package/dist/cjs/presentation/whiteboard/entityCardActions.js.map +1 -0
- package/dist/cjs/presentation/whiteboard/inspector.js +20 -5
- package/dist/cjs/presentation/whiteboard/inspector.js.map +1 -1
- package/dist/cjs/presentation/whiteboard/outline.js +4 -2
- package/dist/cjs/presentation/whiteboard/outline.js.map +1 -1
- package/dist/cjs/presentation/whiteboard/projectElements.js +188 -53
- package/dist/cjs/presentation/whiteboard/projectElements.js.map +1 -1
- package/dist/esm/components/Dialog/Styles.d.ts.map +1 -1
- package/dist/esm/components/Dialog/Styles.js +1 -1
- package/dist/esm/components/Dialog/Styles.js.map +1 -1
- package/dist/esm/components/Overlay/Overlay.d.ts.map +1 -1
- package/dist/esm/components/Overlay/Overlay.js +32 -2
- package/dist/esm/components/Overlay/Overlay.js.map +1 -1
- package/dist/esm/components/Overlay/Styles.d.ts +1 -0
- package/dist/esm/components/Overlay/Styles.d.ts.map +1 -1
- package/dist/esm/components/Overlay/Styles.js +1 -1
- package/dist/esm/components/Overlay/Styles.js.map +1 -1
- package/dist/esm/components/Overlay/overlayStack.d.ts +7 -0
- package/dist/esm/components/Overlay/overlayStack.d.ts.map +1 -0
- package/dist/esm/components/Overlay/overlayStack.js +34 -0
- package/dist/esm/components/Overlay/overlayStack.js.map +1 -0
- package/dist/esm/components/Sheet/Styles.d.ts.map +1 -1
- package/dist/esm/components/Sheet/Styles.js +1 -1
- package/dist/esm/components/Sheet/Styles.js.map +1 -1
- package/dist/esm/presentation/shared/UserDetailsDialog.d.ts +45 -0
- package/dist/esm/presentation/shared/UserDetailsDialog.d.ts.map +1 -0
- package/dist/esm/presentation/shared/UserDetailsDialog.js +115 -0
- package/dist/esm/presentation/shared/UserDetailsDialog.js.map +1 -0
- package/dist/esm/presentation/shared/index.d.ts +2 -0
- package/dist/esm/presentation/shared/index.d.ts.map +1 -1
- package/dist/esm/presentation/shared/index.js +1 -0
- package/dist/esm/presentation/shared/index.js.map +1 -1
- package/dist/esm/presentation/whiteboard/bottomDock.d.ts +3 -2
- package/dist/esm/presentation/whiteboard/bottomDock.d.ts.map +1 -1
- package/dist/esm/presentation/whiteboard/bottomDock.js +9 -4
- package/dist/esm/presentation/whiteboard/bottomDock.js.map +1 -1
- package/dist/esm/presentation/whiteboard/canvasElements.d.ts.map +1 -1
- package/dist/esm/presentation/whiteboard/canvasElements.js +94 -25
- package/dist/esm/presentation/whiteboard/canvasElements.js.map +1 -1
- package/dist/esm/presentation/whiteboard/entityCardActions.d.ts +37 -0
- package/dist/esm/presentation/whiteboard/entityCardActions.d.ts.map +1 -0
- package/dist/esm/presentation/whiteboard/entityCardActions.js +69 -0
- package/dist/esm/presentation/whiteboard/entityCardActions.js.map +1 -0
- package/dist/esm/presentation/whiteboard/inspector.d.ts.map +1 -1
- package/dist/esm/presentation/whiteboard/inspector.js +29 -7
- package/dist/esm/presentation/whiteboard/inspector.js.map +1 -1
- package/dist/esm/presentation/whiteboard/outline.d.ts +1 -1
- package/dist/esm/presentation/whiteboard/outline.d.ts.map +1 -1
- package/dist/esm/presentation/whiteboard/outline.js +5 -3
- package/dist/esm/presentation/whiteboard/outline.js.map +1 -1
- package/dist/esm/presentation/whiteboard/projectElements.d.ts +40 -8
- package/dist/esm/presentation/whiteboard/projectElements.d.ts.map +1 -1
- package/dist/esm/presentation/whiteboard/projectElements.js +181 -55
- package/dist/esm/presentation/whiteboard/projectElements.js.map +1 -1
- package/dist/index.js +87 -13
- package/dist/index.js.map +1 -1
- package/dist/index.min.js +1 -1
- package/dist/index.min.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Sheet/Styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AASvD,eAAO,MAAM,gBAAgB,oEA2B5B,CAAC;AAIF,UAAU,mBAAmB;IAC3B,SAAS,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAC;IACxC,KAAK,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAC;CAC9B;AAED,eAAO,MAAM,kBAAkB,qFAmG9B,CAAC;AAIF,UAAU,wBAAwB;IAChC,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,eAAO,MAAM,uBAAuB,
|
|
1
|
+
{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Sheet/Styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AASvD,eAAO,MAAM,gBAAgB,oEA2B5B,CAAC;AAIF,UAAU,mBAAmB;IAC3B,SAAS,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAC;IACxC,KAAK,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAC;CAC9B;AAED,eAAO,MAAM,kBAAkB,qFAmG9B,CAAC;AAIF,UAAU,wBAAwB;IAChC,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,eAAO,MAAM,uBAAuB,0FAkBnC,CAAC;AAIF,eAAO,MAAM,sBAAsB,uCASlC,CAAC;AAEF,eAAO,MAAM,yBAAyB,uCASrC,CAAC;AAEF,eAAO,MAAM,2BAA2B,uCASvC,CAAC;AAEF,eAAO,MAAM,4BAA4B,uCASxC,CAAC;AAEF,UAAU,mBAAmB;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,cAAc,EAAE,MAAM,CAAC;IACvB,eAAe,EAAE,MAAM,CAAC;IACxB,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,eAAO,MAAM,kBAAkB,sFA6D9B,CAAC;AAIF,eAAO,MAAM,mBAAmB;gBAClB,MAAM;SA6HnB,CAAC;AAIF,eAAO,MAAM,mBAAmB;;;kBAE/B,CAAC;AAIF,eAAO,MAAM,uBAAuB,oEASnC,CAAC;AAIF,eAAO,MAAM,YAAY,oEAIxB,CAAC"}
|
|
@@ -27,7 +27,7 @@ export const StyledSheetWrapperPaper = styled.div.attrs(props => ({
|
|
|
27
27
|
})).withConfig({
|
|
28
28
|
displayName: "Styles__StyledSheetWrapperPaper",
|
|
29
29
|
componentId: "sc-144eyxd-2"
|
|
30
|
-
})(["background-color:var(--page-paper-main);color:var(--color-theme-900);box-shadow:var(--shadow-primary);border-radius:6px;overflow:auto;animation:0.3s linear ease-out;", ""], {
|
|
30
|
+
})(["background-color:var(--page-paper-main);color:var(--color-theme-900);box-shadow:var(--shadow-primary);border-radius:6px;overflow:auto;animation:0.3s linear ease-out;transform:translateZ(0);contain:paint;overscroll-behavior:contain;", ""], {
|
|
31
31
|
"flex": "1 1 auto"
|
|
32
32
|
});
|
|
33
33
|
StyledSheetWrapperPaper.displayName = "StyledSheetWrapperPaper";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Styles.js","names":["CSSTransition","styled","css","keyframes","BoxSizingStyle","FontStyle","ListSeparator","StyledSheetIcons","div","withConfig","displayName","componentId","StyledSheetWrapper","props","$mode","$position","StyledSheetWrapperPaper","attrs","className","paperClass","StyledSheetControlsTop","StyledSheetControlsBottom","StyledSheetControlsCenterIn","StyledSheetControlsCenterOut","StyledAnimatedSpan","span","$state","$durationIn","$maxDurationIn","$disabled","$durationOut","$maxDurationOut","StyledCssTransition","$direction","StyledListSeparator","StyledIconsWrapperSmall","StyledHeader"],"sources":["../../../../src/components/Sheet/Styles.ts"],"sourcesContent":["import { CSSTransition } from \"react-transition-group\";\n\nimport styled, { css, keyframes } from \"styled-components\";\nimport tw from \"twin.macro\";\n\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { FontStyle } from \"../FontStyle\";\nimport { ListSeparator } from \"../List\";\n\nexport const StyledSheetIcons = styled.div`\n display: flex;\n height: 0;\n position: relative;\n\n span {\n position: relative;\n background-color: var(--page-paper-main);\n box-shadow: var(--shadow-secondary);\n cursor: pointer;\n border-radius: 100%;\n width: 40px;\n height: 40px;\n display: flex;\n justify-content: center;\n align-items: center;\n & > * {\n height: 40px;\n width: 40px;\n padding: 8px;\n fill: var(--color-theme-600);\n }\n }\n\n @media (max-width: 640px) {\n display: none;\n }\n`;\n\nStyledSheetIcons.displayName = \"StyledSheetIcons\";\n\ninterface IStyledSheetWrapper {\n $position?: \"center\" | \"left\" | \"right\";\n $mode?: \"normal\" | \"stretch\";\n}\n\nexport const StyledSheetWrapper = styled.div<IStyledSheetWrapper>`\n ${BoxSizingStyle}\n ${FontStyle}\n\n position: relative;\n max-width: 95vw;\n display: flex;\n flex-direction: row;\n\n ${(props) =>\n props.$mode === \"stretch\"\n ? css`\n margin-top: 8px;\n height: calc(100vh - 16px);\n width: calc(100vw - 100px);\n max-width: 1000px;\n ${StyledSheetIcons} {\n flex-direction: column;\n width: 0;\n height: calc(100vh - 32px);\n & > * {\n margin-bottom: 8px;\n animation-fill-mode: both;\n }\n span {\n top: 8px;\n }\n }\n `\n : css`\n max-height: calc(100vh - 156px);\n margin-top: 126px;\n margin-bottom: 30px;\n width: 540px;\n flex-direction: column;\n\n ${StyledSheetIcons} {\n flex-direction: row-reverse;\n & > * {\n margin-left: 8px;\n animation-fill-mode: both;\n }\n span {\n top: -48px;\n right: 8px;\n }\n }\n `}\n\n ${(props) =>\n props.$mode === \"stretch\" &&\n css`\n @media (max-width: 640px) {\n width: 100%;\n height: 100%;\n }\n `}\n\n ${(props) =>\n props.$position === \"center\" &&\n css`\n ${tw`tw-mx-auto`}\n `}\n\n ${(props) =>\n props.$position === \"left\" &&\n css`\n ${tw`tw-ml-2 tw-mr-auto`}\n `}\n\n ${(props) =>\n props.$position === \"right\" &&\n css`\n ${tw`tw-mr-2 tw-ml-auto`}\n `}\n\n ${(props) =>\n props.$mode === \"stretch\" &&\n props.$position !== \"left\" &&\n css`\n ${StyledSheetIcons} {\n span {\n right: 48px;\n }\n }\n `}\n\n ${(props) =>\n props.$mode === \"stretch\" &&\n props.$position === \"left\" &&\n css`\n flex-direction: row-reverse;\n\n ${StyledSheetIcons} {\n span {\n right: -8px;\n }\n }\n `}\n`;\n\nStyledSheetWrapper.displayName = \"StyledSheetWrapper\";\n\ninterface IStyledSheetWrapperPaper {\n paperClass?: string;\n}\n\nexport const StyledSheetWrapperPaper = styled.div.attrs<IStyledSheetWrapperPaper>(\n (props) => ({\n className: props.paperClass,\n })\n)<IStyledSheetWrapperPaper>`\n background-color: var(--page-paper-main);\n color: var(--color-theme-900);\n box-shadow: var(--shadow-primary);\n border-radius: 6px;\n overflow: auto;\n animation: 0.3s linear ease-out;\n\n ${tw`tw-flex-auto`}\n`;\n\nStyledSheetWrapperPaper.displayName = \"StyledSheetWrapperPaper\";\n\nexport const StyledSheetControlsTop = keyframes`\n 0% {\n opacity: 0;\n transform: translateY(-200px);\n }\n 100% {\n opacity: 1;\n transform: translateY(0);\n }\n`;\n\nexport const StyledSheetControlsBottom = keyframes`\n 0% {\n opacity: 1;\n transform: translateY(0);\n }\n 100% {\n opacity: 0;\n transform: translateY(-200px);\n}\n`;\n\nexport const StyledSheetControlsCenterIn = keyframes`\n 0% {\n transform: translateY(-150px);\n opacity: 0;\n }\n 100% {\n transform: translateY(0);\n opacity: 1;\n }\n`;\n\nexport const StyledSheetControlsCenterOut = keyframes`\n 0% {\n transform: translateY(0);\n opacity: 1;\n }\n 100% {\n transform: translateY(-150px);\n opacity: 0;\n }\n`;\n\ninterface IStyledAnimatedSpan {\n $mode: string;\n $state?: string;\n $maxDurationIn: number;\n $maxDurationOut: number;\n $durationOut: number;\n $durationIn: number;\n $disabled?: boolean;\n}\n\nexport const StyledAnimatedSpan = styled.span<IStyledAnimatedSpan>`\n &:hover svg {\n fill: var(--color-primary);\n }\n ${(props) =>\n props.$state === \"entering\" &&\n css`\n opacity: 1;\n\n ${props.$mode === \"stretch\"\n ? css`\n animation-name: ${StyledSheetControlsTop};\n animation-duration: ${`${props.$durationIn}s`};\n animation-delay: ${`${props.$durationIn}s`};\n `\n : css`\n animation-name: ${StyledSheetControlsCenterIn};\n animation-duration: ${`${props.$maxDurationIn}s`};\n animation-delay: 0s;\n `}\n `}\n\n ${(props) =>\n props.$state === \"entered\" &&\n css`\n opacity: 1;\n `}\n\n ${(props) =>\n props.$disabled &&\n css`\n pointer-events: none;\n\n svg {\n opacity: 0.5;\n }\n `}\n\n ${(props) =>\n props.$state === \"exiting\" &&\n css`\n opacity: 0;\n\n ${props.$mode === \"stretch\"\n ? css`\n animation-name: ${StyledSheetControlsBottom};\n animation-duration: ${`${props.$durationOut}s`};\n animation-delay: ${`${props.$durationOut}s`};\n `\n : css`\n animation-name: ${StyledSheetControlsCenterOut};\n animation-duration: ${`${props.$maxDurationOut}s`};\n animation-delay: 0;\n `}\n `}\n\n ${(props) =>\n props.$state === \"exited\" &&\n css`\n opacity: 0;\n `}\n`;\n\nStyledAnimatedSpan.displayName = \"StyledAnimatedSpan\";\n\nexport const StyledCssTransition = styled(CSSTransition)<{\n $direction: string;\n}>`\n ${(props) =>\n props.$direction === \"top\" &&\n css`\n &.c-sheet__animation-enter {\n opacity: 0;\n transform: translateY(-100%);\n }\n &.c-sheet__animation-enter-active {\n opacity: 1;\n transform: translateY(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-appear {\n opacity: 0;\n transform: translateY(-100%);\n }\n &.c-sheet__animation-appear-active {\n opacity: 1;\n transform: translateY(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-exit {\n opacity: 1;\n }\n &.c-sheet__animation-exit-active {\n opacity: 0;\n transform: translateY(-100%);\n transition: opacity 200ms, transform 200ms;\n }\n `}\n\n ${(props) =>\n props.$direction === \"bottom\" &&\n css`\n &.c-sheet__animation-enter {\n opacity: 0;\n transform: translateY(100%);\n }\n &.c-sheet__animation-enter-active {\n opacity: 1;\n transform: translateY(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-appear {\n opacity: 0;\n transform: translateY(100%);\n }\n &.c-sheet__animation-appear-active {\n opacity: 1;\n transform: translateY(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-exit {\n opacity: 1;\n }\n &.c-sheet__animation-exit-active {\n opacity: 0;\n transform: translateY(100%);\n transition: opacity 200ms, transform 200ms;\n }\n `}\n\n ${(props) =>\n props.$direction === \"left\" &&\n css`\n &.c-sheet__animation-enter {\n opacity: 0;\n transform: translateX(-100%);\n }\n &.c-sheet__animation-enter-active {\n opacity: 1;\n transform: translateX(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-appear {\n opacity: 0;\n transform: translateX(-100%);\n }\n &.c-sheet__animation-appear-active {\n opacity: 1;\n transform: translateX(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-exit {\n opacity: 1;\n }\n &.c-sheet__animation-exit-active {\n opacity: 0;\n transform: translateX(-100%);\n transition: opacity 200ms, transform 200ms;\n }\n `}\n\n ${(props) =>\n props.$direction === \"right\" &&\n css`\n &.c-sheet__animation-enter {\n opacity: 0;\n transform: translateX(100%);\n }\n &.c-sheet__animation-enter-active {\n opacity: 1;\n transform: translateX(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-appear {\n opacity: 0;\n transform: translateX(100%);\n }\n &.c-sheet__animation-appear-active {\n opacity: 1;\n transform: translateX(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-exit {\n opacity: 1;\n }\n &.c-sheet__animation-exit-active {\n opacity: 0;\n transform: translateX(100%);\n transition: opacity 200ms, transform 200ms;\n }\n `}\n`;\n\nStyledCssTransition.displayName = \"StyledCssTransition\";\n\nexport const StyledListSeparator = styled(ListSeparator)`\n margin: 0;\n`;\n\nStyledListSeparator.displayName = \"StyledListSeparator\";\n\nexport const StyledIconsWrapperSmall = styled.div`\n height: 40px;\n display: flex;\n gap: 8px;\n padding-left: 16px;\n padding-right: 16px;\n align-items: center;\n place-content: end;\n flex-direction: row-reverse;\n`;\n\nStyledIconsWrapperSmall.displayName = \"StyledIconsWrapperSmall\";\n\nexport const StyledHeader = styled.div`\n @media (min-width: 640px) {\n display: none;\n }\n`;\n\nStyledHeader.displayName = \"StyledHeader\";\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"Styles.js","names":["CSSTransition","styled","css","keyframes","BoxSizingStyle","FontStyle","ListSeparator","StyledSheetIcons","div","withConfig","displayName","componentId","StyledSheetWrapper","props","$mode","$position","StyledSheetWrapperPaper","attrs","className","paperClass","StyledSheetControlsTop","StyledSheetControlsBottom","StyledSheetControlsCenterIn","StyledSheetControlsCenterOut","StyledAnimatedSpan","span","$state","$durationIn","$maxDurationIn","$disabled","$durationOut","$maxDurationOut","StyledCssTransition","$direction","StyledListSeparator","StyledIconsWrapperSmall","StyledHeader"],"sources":["../../../../src/components/Sheet/Styles.ts"],"sourcesContent":["import { CSSTransition } from \"react-transition-group\";\n\nimport styled, { css, keyframes } from \"styled-components\";\nimport tw from \"twin.macro\";\n\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { FontStyle } from \"../FontStyle\";\nimport { ListSeparator } from \"../List\";\n\nexport const StyledSheetIcons = styled.div`\n display: flex;\n height: 0;\n position: relative;\n\n span {\n position: relative;\n background-color: var(--page-paper-main);\n box-shadow: var(--shadow-secondary);\n cursor: pointer;\n border-radius: 100%;\n width: 40px;\n height: 40px;\n display: flex;\n justify-content: center;\n align-items: center;\n & > * {\n height: 40px;\n width: 40px;\n padding: 8px;\n fill: var(--color-theme-600);\n }\n }\n\n @media (max-width: 640px) {\n display: none;\n }\n`;\n\nStyledSheetIcons.displayName = \"StyledSheetIcons\";\n\ninterface IStyledSheetWrapper {\n $position?: \"center\" | \"left\" | \"right\";\n $mode?: \"normal\" | \"stretch\";\n}\n\nexport const StyledSheetWrapper = styled.div<IStyledSheetWrapper>`\n ${BoxSizingStyle}\n ${FontStyle}\n\n position: relative;\n max-width: 95vw;\n display: flex;\n flex-direction: row;\n\n ${(props) =>\n props.$mode === \"stretch\"\n ? css`\n margin-top: 8px;\n height: calc(100vh - 16px);\n width: calc(100vw - 100px);\n max-width: 1000px;\n ${StyledSheetIcons} {\n flex-direction: column;\n width: 0;\n height: calc(100vh - 32px);\n & > * {\n margin-bottom: 8px;\n animation-fill-mode: both;\n }\n span {\n top: 8px;\n }\n }\n `\n : css`\n max-height: calc(100vh - 156px);\n margin-top: 126px;\n margin-bottom: 30px;\n width: 540px;\n flex-direction: column;\n\n ${StyledSheetIcons} {\n flex-direction: row-reverse;\n & > * {\n margin-left: 8px;\n animation-fill-mode: both;\n }\n span {\n top: -48px;\n right: 8px;\n }\n }\n `}\n\n ${(props) =>\n props.$mode === \"stretch\" &&\n css`\n @media (max-width: 640px) {\n width: 100%;\n height: 100%;\n }\n `}\n\n ${(props) =>\n props.$position === \"center\" &&\n css`\n ${tw`tw-mx-auto`}\n `}\n\n ${(props) =>\n props.$position === \"left\" &&\n css`\n ${tw`tw-ml-2 tw-mr-auto`}\n `}\n\n ${(props) =>\n props.$position === \"right\" &&\n css`\n ${tw`tw-mr-2 tw-ml-auto`}\n `}\n\n ${(props) =>\n props.$mode === \"stretch\" &&\n props.$position !== \"left\" &&\n css`\n ${StyledSheetIcons} {\n span {\n right: 48px;\n }\n }\n `}\n\n ${(props) =>\n props.$mode === \"stretch\" &&\n props.$position === \"left\" &&\n css`\n flex-direction: row-reverse;\n\n ${StyledSheetIcons} {\n span {\n right: -8px;\n }\n }\n `}\n`;\n\nStyledSheetWrapper.displayName = \"StyledSheetWrapper\";\n\ninterface IStyledSheetWrapperPaper {\n paperClass?: string;\n}\n\nexport const StyledSheetWrapperPaper = styled.div.attrs<IStyledSheetWrapperPaper>(\n (props) => ({\n className: props.paperClass,\n })\n)<IStyledSheetWrapperPaper>`\n background-color: var(--page-paper-main);\n color: var(--color-theme-900);\n box-shadow: var(--shadow-primary);\n border-radius: 6px;\n overflow: auto;\n animation: 0.3s linear ease-out;\n /* Scrolling here must not dirty the blurred overlays below, which already clip to this box. */\n transform: translateZ(0);\n contain: paint;\n /* A scroll that runs off the end must stop here. Chained to the page, it moves what the blur samples. */\n overscroll-behavior: contain;\n\n ${tw`tw-flex-auto`}\n`;\n\nStyledSheetWrapperPaper.displayName = \"StyledSheetWrapperPaper\";\n\nexport const StyledSheetControlsTop = keyframes`\n 0% {\n opacity: 0;\n transform: translateY(-200px);\n }\n 100% {\n opacity: 1;\n transform: translateY(0);\n }\n`;\n\nexport const StyledSheetControlsBottom = keyframes`\n 0% {\n opacity: 1;\n transform: translateY(0);\n }\n 100% {\n opacity: 0;\n transform: translateY(-200px);\n}\n`;\n\nexport const StyledSheetControlsCenterIn = keyframes`\n 0% {\n transform: translateY(-150px);\n opacity: 0;\n }\n 100% {\n transform: translateY(0);\n opacity: 1;\n }\n`;\n\nexport const StyledSheetControlsCenterOut = keyframes`\n 0% {\n transform: translateY(0);\n opacity: 1;\n }\n 100% {\n transform: translateY(-150px);\n opacity: 0;\n }\n`;\n\ninterface IStyledAnimatedSpan {\n $mode: string;\n $state?: string;\n $maxDurationIn: number;\n $maxDurationOut: number;\n $durationOut: number;\n $durationIn: number;\n $disabled?: boolean;\n}\n\nexport const StyledAnimatedSpan = styled.span<IStyledAnimatedSpan>`\n &:hover svg {\n fill: var(--color-primary);\n }\n ${(props) =>\n props.$state === \"entering\" &&\n css`\n opacity: 1;\n\n ${props.$mode === \"stretch\"\n ? css`\n animation-name: ${StyledSheetControlsTop};\n animation-duration: ${`${props.$durationIn}s`};\n animation-delay: ${`${props.$durationIn}s`};\n `\n : css`\n animation-name: ${StyledSheetControlsCenterIn};\n animation-duration: ${`${props.$maxDurationIn}s`};\n animation-delay: 0s;\n `}\n `}\n\n ${(props) =>\n props.$state === \"entered\" &&\n css`\n opacity: 1;\n `}\n\n ${(props) =>\n props.$disabled &&\n css`\n pointer-events: none;\n\n svg {\n opacity: 0.5;\n }\n `}\n\n ${(props) =>\n props.$state === \"exiting\" &&\n css`\n opacity: 0;\n\n ${props.$mode === \"stretch\"\n ? css`\n animation-name: ${StyledSheetControlsBottom};\n animation-duration: ${`${props.$durationOut}s`};\n animation-delay: ${`${props.$durationOut}s`};\n `\n : css`\n animation-name: ${StyledSheetControlsCenterOut};\n animation-duration: ${`${props.$maxDurationOut}s`};\n animation-delay: 0;\n `}\n `}\n\n ${(props) =>\n props.$state === \"exited\" &&\n css`\n opacity: 0;\n `}\n`;\n\nStyledAnimatedSpan.displayName = \"StyledAnimatedSpan\";\n\nexport const StyledCssTransition = styled(CSSTransition)<{\n $direction: string;\n}>`\n ${(props) =>\n props.$direction === \"top\" &&\n css`\n &.c-sheet__animation-enter {\n opacity: 0;\n transform: translateY(-100%);\n }\n &.c-sheet__animation-enter-active {\n opacity: 1;\n transform: translateY(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-appear {\n opacity: 0;\n transform: translateY(-100%);\n }\n &.c-sheet__animation-appear-active {\n opacity: 1;\n transform: translateY(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-exit {\n opacity: 1;\n }\n &.c-sheet__animation-exit-active {\n opacity: 0;\n transform: translateY(-100%);\n transition: opacity 200ms, transform 200ms;\n }\n `}\n\n ${(props) =>\n props.$direction === \"bottom\" &&\n css`\n &.c-sheet__animation-enter {\n opacity: 0;\n transform: translateY(100%);\n }\n &.c-sheet__animation-enter-active {\n opacity: 1;\n transform: translateY(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-appear {\n opacity: 0;\n transform: translateY(100%);\n }\n &.c-sheet__animation-appear-active {\n opacity: 1;\n transform: translateY(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-exit {\n opacity: 1;\n }\n &.c-sheet__animation-exit-active {\n opacity: 0;\n transform: translateY(100%);\n transition: opacity 200ms, transform 200ms;\n }\n `}\n\n ${(props) =>\n props.$direction === \"left\" &&\n css`\n &.c-sheet__animation-enter {\n opacity: 0;\n transform: translateX(-100%);\n }\n &.c-sheet__animation-enter-active {\n opacity: 1;\n transform: translateX(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-appear {\n opacity: 0;\n transform: translateX(-100%);\n }\n &.c-sheet__animation-appear-active {\n opacity: 1;\n transform: translateX(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-exit {\n opacity: 1;\n }\n &.c-sheet__animation-exit-active {\n opacity: 0;\n transform: translateX(-100%);\n transition: opacity 200ms, transform 200ms;\n }\n `}\n\n ${(props) =>\n props.$direction === \"right\" &&\n css`\n &.c-sheet__animation-enter {\n opacity: 0;\n transform: translateX(100%);\n }\n &.c-sheet__animation-enter-active {\n opacity: 1;\n transform: translateX(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-appear {\n opacity: 0;\n transform: translateX(100%);\n }\n &.c-sheet__animation-appear-active {\n opacity: 1;\n transform: translateX(0);\n transition: opacity 400ms, transform 400ms;\n }\n &.c-sheet__animation-exit {\n opacity: 1;\n }\n &.c-sheet__animation-exit-active {\n opacity: 0;\n transform: translateX(100%);\n transition: opacity 200ms, transform 200ms;\n }\n `}\n`;\n\nStyledCssTransition.displayName = \"StyledCssTransition\";\n\nexport const StyledListSeparator = styled(ListSeparator)`\n margin: 0;\n`;\n\nStyledListSeparator.displayName = \"StyledListSeparator\";\n\nexport const StyledIconsWrapperSmall = styled.div`\n height: 40px;\n display: flex;\n gap: 8px;\n padding-left: 16px;\n padding-right: 16px;\n align-items: center;\n place-content: end;\n flex-direction: row-reverse;\n`;\n\nStyledIconsWrapperSmall.displayName = \"StyledIconsWrapperSmall\";\n\nexport const StyledHeader = styled.div`\n @media (min-width: 640px) {\n display: none;\n }\n`;\n\nStyledHeader.displayName = \"StyledHeader\";\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
import { ReactElement } from "react";
|
|
2
|
+
/**
|
|
3
|
+
* A small, props-driven person card shown in a centred DS `Dialog`. It is built
|
|
4
|
+
* only from design-system primitives (Dialog, RoundAvatar, Chip, Button,
|
|
5
|
+
* Typography, Icons) so any story can drop it in with its own data — nothing
|
|
6
|
+
* about a specific person is baked in.
|
|
7
|
+
*
|
|
8
|
+
* The face mirrors the product's person quick-look:
|
|
9
|
+
* - a large circular avatar;
|
|
10
|
+
* - the name in bold, immediately followed by a small grey working-hours pill;
|
|
11
|
+
* - the primary email, with a trailing "+ N more" overflow for extra contacts;
|
|
12
|
+
* - the joined date, in secondary text;
|
|
13
|
+
* - a close (X) in the top-right corner;
|
|
14
|
+
* - a left-aligned footer: a filled "Send message" and a text "See full
|
|
15
|
+
* profile" link.
|
|
16
|
+
*/
|
|
17
|
+
export declare const USER_DETAILS_AVATAR_SIZE = 96;
|
|
18
|
+
export interface UserDetailsAvatar {
|
|
19
|
+
/** Background colour behind the initials (data, stands in for a real avatar). */
|
|
20
|
+
color: string;
|
|
21
|
+
/** Two-letter initials, shown when there is no image. */
|
|
22
|
+
initials: string;
|
|
23
|
+
/** Optional avatar image; when set it replaces the initials. */
|
|
24
|
+
imageUrl?: string;
|
|
25
|
+
}
|
|
26
|
+
export interface UserDetailsDialogProps {
|
|
27
|
+
open: boolean;
|
|
28
|
+
avatar: UserDetailsAvatar;
|
|
29
|
+
name: string;
|
|
30
|
+
/** A short working-hours pill next to the name, e.g. "40 h/w". Omit to hide. */
|
|
31
|
+
hoursLabel?: string;
|
|
32
|
+
email: string;
|
|
33
|
+
/** Count of extra contacts, rendered as "+ N more". Omit / 0 to hide. */
|
|
34
|
+
extraContactsCount?: number;
|
|
35
|
+
/** Free-form joined line, e.g. "Joined: Feb 7. 2009". */
|
|
36
|
+
joinedDate: string;
|
|
37
|
+
onSendMessage?: () => void;
|
|
38
|
+
onSeeFullProfile?: () => void;
|
|
39
|
+
onClose?: () => void;
|
|
40
|
+
}
|
|
41
|
+
export declare const UserDetailsDialog: {
|
|
42
|
+
({ open, avatar, name, hoursLabel, email, extraContactsCount, joinedDate, onSendMessage, onSeeFullProfile, onClose, }: UserDetailsDialogProps): ReactElement;
|
|
43
|
+
displayName: string;
|
|
44
|
+
};
|
|
45
|
+
//# sourceMappingURL=UserDetailsDialog.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"UserDetailsDialog.d.ts","sourceRoot":"","sources":["../../../../src/presentation/shared/UserDetailsDialog.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAgB5C;;;;;;;;;;;;;;GAcG;AAIH,eAAO,MAAM,wBAAwB,KAAK,CAAC;AAE3C,MAAM,WAAW,iBAAiB;IAChC,iFAAiF;IACjF,KAAK,EAAE,MAAM,CAAC;IACd,yDAAyD;IACzD,QAAQ,EAAE,MAAM,CAAC;IACjB,gEAAgE;IAChE,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,WAAW,sBAAsB;IACrC,IAAI,EAAE,OAAO,CAAC;IACd,MAAM,EAAE,iBAAiB,CAAC;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,gFAAgF;IAChF,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,yEAAyE;IACzE,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,yDAAyD;IACzD,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC9B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAoFD,eAAO,MAAM,iBAAiB;2HAW3B,sBAAsB,GAAG,YAAY;;CA6EvC,CAAC"}
|
|
@@ -0,0 +1,115 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import styled from "styled-components";
|
|
3
|
+
import { RoundAvatar } from "./RoundAvatar";
|
|
4
|
+
import { Button } from "../../components/Button";
|
|
5
|
+
import { Chip } from "../../components/Chip";
|
|
6
|
+
import { Dialog } from "../../components/Dialog";
|
|
7
|
+
import { IconButton } from "../../components/IconButton";
|
|
8
|
+
import { CancelCrossIcon } from "../../components/Icons";
|
|
9
|
+
import { Body2, Caption1, Header2 } from "../../components/Typography";
|
|
10
|
+
|
|
11
|
+
/* ------------------------------------------------------------------ */
|
|
12
|
+
/* UserDetailsDialog — a reusable person "quick look" dialog */
|
|
13
|
+
/* ------------------------------------------------------------------ */
|
|
14
|
+
|
|
15
|
+
/**
|
|
16
|
+
* A small, props-driven person card shown in a centred DS `Dialog`. It is built
|
|
17
|
+
* only from design-system primitives (Dialog, RoundAvatar, Chip, Button,
|
|
18
|
+
* Typography, Icons) so any story can drop it in with its own data — nothing
|
|
19
|
+
* about a specific person is baked in.
|
|
20
|
+
*
|
|
21
|
+
* The face mirrors the product's person quick-look:
|
|
22
|
+
* - a large circular avatar;
|
|
23
|
+
* - the name in bold, immediately followed by a small grey working-hours pill;
|
|
24
|
+
* - the primary email, with a trailing "+ N more" overflow for extra contacts;
|
|
25
|
+
* - the joined date, in secondary text;
|
|
26
|
+
* - a close (X) in the top-right corner;
|
|
27
|
+
* - a left-aligned footer: a filled "Send message" and a text "See full
|
|
28
|
+
* profile" link.
|
|
29
|
+
*/
|
|
30
|
+
|
|
31
|
+
/* Diameter of the header avatar. ~96px per the spec, large enough to carry an
|
|
32
|
+
image or two-letter initials comfortably. */
|
|
33
|
+
export const USER_DETAILS_AVATAR_SIZE = 96;
|
|
34
|
+
const StyledHeader = styled.div.withConfig({
|
|
35
|
+
displayName: "UserDetailsDialog__StyledHeader",
|
|
36
|
+
componentId: "sc-4r9p4-0"
|
|
37
|
+
})(["position:relative;display:flex;align-items:flex-start;gap:16px;.udd-close{position:absolute;top:-8px;right:-12px;}"]);
|
|
38
|
+
|
|
39
|
+
/* The avatar. A plain circle — a fixed box so it never shrinks beside the info. */
|
|
40
|
+
const StyledAvatar = styled.div.withConfig({
|
|
41
|
+
displayName: "UserDetailsDialog__StyledAvatar",
|
|
42
|
+
componentId: "sc-4r9p4-1"
|
|
43
|
+
})(["flex-shrink:0;width:", "px;height:", "px;.udd-avatar-image{background-size:cover;background-position:center;color:transparent;}"], props => props.$size, props => props.$size);
|
|
44
|
+
const StyledInfo = styled.div.withConfig({
|
|
45
|
+
displayName: "UserDetailsDialog__StyledInfo",
|
|
46
|
+
componentId: "sc-4r9p4-2"
|
|
47
|
+
})(["min-width:0;flex:1;display:flex;flex-direction:column;gap:6px;padding-top:4px;.udd-name-row{display:flex;align-items:center;gap:8px;min-width:0;}.udd-name-row > .typography{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}.udd-hours{flex-shrink:0;}.udd-contact-row{display:flex;align-items:baseline;gap:8px;min-width:0;}.udd-email{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}.udd-more{flex-shrink:0;}"]);
|
|
48
|
+
|
|
49
|
+
/* Dialog.Actions is only padding, so the footer lays itself out: left-aligned,
|
|
50
|
+
the filled action first and the text link beside it. The link is underlined to
|
|
51
|
+
match the reference. */
|
|
52
|
+
const StyledActions = styled.div.withConfig({
|
|
53
|
+
displayName: "UserDetailsDialog__StyledActions",
|
|
54
|
+
componentId: "sc-4r9p4-3"
|
|
55
|
+
})(["display:flex;align-items:center;gap:12px;.udd-profile-link{text-decoration:underline;}"]);
|
|
56
|
+
export const UserDetailsDialog = _ref => {
|
|
57
|
+
let open = _ref.open,
|
|
58
|
+
avatar = _ref.avatar,
|
|
59
|
+
name = _ref.name,
|
|
60
|
+
hoursLabel = _ref.hoursLabel,
|
|
61
|
+
email = _ref.email,
|
|
62
|
+
extraContactsCount = _ref.extraContactsCount,
|
|
63
|
+
joinedDate = _ref.joinedDate,
|
|
64
|
+
onSendMessage = _ref.onSendMessage,
|
|
65
|
+
onSeeFullProfile = _ref.onSeeFullProfile,
|
|
66
|
+
onClose = _ref.onClose;
|
|
67
|
+
return /*#__PURE__*/React.createElement(Dialog, {
|
|
68
|
+
open: open,
|
|
69
|
+
onClose: onClose,
|
|
70
|
+
enableBackgroundClick: true
|
|
71
|
+
}, /*#__PURE__*/React.createElement(Dialog.Content, null, /*#__PURE__*/React.createElement(StyledHeader, null, /*#__PURE__*/React.createElement(StyledAvatar, {
|
|
72
|
+
$size: USER_DETAILS_AVATAR_SIZE
|
|
73
|
+
}, /*#__PURE__*/React.createElement(RoundAvatar, {
|
|
74
|
+
$size: USER_DETAILS_AVATAR_SIZE,
|
|
75
|
+
$bg: avatar.color,
|
|
76
|
+
$bordered: false,
|
|
77
|
+
className: avatar.imageUrl ? "udd-avatar-image" : undefined,
|
|
78
|
+
style: avatar.imageUrl ? {
|
|
79
|
+
backgroundImage: "url(" + avatar.imageUrl + ")"
|
|
80
|
+
} : undefined
|
|
81
|
+
}, avatar.imageUrl ? "" : avatar.initials)), /*#__PURE__*/React.createElement(StyledInfo, null, /*#__PURE__*/React.createElement("div", {
|
|
82
|
+
className: "udd-name-row"
|
|
83
|
+
}, /*#__PURE__*/React.createElement(Header2, null, name), hoursLabel ? /*#__PURE__*/React.createElement("span", {
|
|
84
|
+
className: "udd-hours"
|
|
85
|
+
}, /*#__PURE__*/React.createElement(Chip, {
|
|
86
|
+
size: "small",
|
|
87
|
+
label: hoursLabel,
|
|
88
|
+
backgroundColor: "var(--color-theme-300)",
|
|
89
|
+
color: "var(--color-theme-900)"
|
|
90
|
+
})) : null), /*#__PURE__*/React.createElement("div", {
|
|
91
|
+
className: "udd-contact-row"
|
|
92
|
+
}, /*#__PURE__*/React.createElement(Body2, {
|
|
93
|
+
color: "secondary",
|
|
94
|
+
className: "udd-email"
|
|
95
|
+
}, email), extraContactsCount ? /*#__PURE__*/React.createElement(Body2, {
|
|
96
|
+
color: "secondary",
|
|
97
|
+
className: "udd-more"
|
|
98
|
+
}, "+ ", extraContactsCount, " more") : null), /*#__PURE__*/React.createElement(Caption1, {
|
|
99
|
+
color: "secondary"
|
|
100
|
+
}, joinedDate)), /*#__PURE__*/React.createElement(IconButton, {
|
|
101
|
+
className: "udd-close",
|
|
102
|
+
variant: "text gray",
|
|
103
|
+
onClick: onClose,
|
|
104
|
+
"aria-label": "Close"
|
|
105
|
+
}, /*#__PURE__*/React.createElement(CancelCrossIcon, null)))), /*#__PURE__*/React.createElement(Dialog.ContentDivider, null), /*#__PURE__*/React.createElement(Dialog.Actions, null, /*#__PURE__*/React.createElement(StyledActions, null, /*#__PURE__*/React.createElement(Button, {
|
|
106
|
+
variant: "primary",
|
|
107
|
+
onClick: onSendMessage
|
|
108
|
+
}, "Send message"), /*#__PURE__*/React.createElement(Button, {
|
|
109
|
+
variant: "text colored",
|
|
110
|
+
className: "udd-profile-link",
|
|
111
|
+
onClick: onSeeFullProfile
|
|
112
|
+
}, "See full profile"))));
|
|
113
|
+
};
|
|
114
|
+
UserDetailsDialog.displayName = "UserDetailsDialog";
|
|
115
|
+
//# sourceMappingURL=UserDetailsDialog.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"UserDetailsDialog.js","names":["React","styled","RoundAvatar","Button","Chip","Dialog","IconButton","CancelCrossIcon","Body2","Caption1","Header2","USER_DETAILS_AVATAR_SIZE","StyledHeader","div","withConfig","displayName","componentId","StyledAvatar","props","$size","StyledInfo","StyledActions","UserDetailsDialog","_ref","open","avatar","name","hoursLabel","email","extraContactsCount","joinedDate","onSendMessage","onSeeFullProfile","onClose","createElement","enableBackgroundClick","Content","$bg","color","$bordered","className","imageUrl","undefined","style","backgroundImage","initials","size","label","backgroundColor","variant","onClick","ContentDivider","Actions"],"sources":["../../../../src/presentation/shared/UserDetailsDialog.tsx"],"sourcesContent":["import React, { ReactElement } from \"react\";\n\nimport styled from \"styled-components\";\n\nimport { RoundAvatar } from \"./RoundAvatar\";\nimport { Button } from \"../../components/Button\";\nimport { Chip } from \"../../components/Chip\";\nimport { Dialog } from \"../../components/Dialog\";\nimport { IconButton } from \"../../components/IconButton\";\nimport { CancelCrossIcon } from \"../../components/Icons\";\nimport { Body2, Caption1, Header2 } from \"../../components/Typography\";\n\n/* ------------------------------------------------------------------ */\n/* UserDetailsDialog — a reusable person \"quick look\" dialog */\n/* ------------------------------------------------------------------ */\n\n/**\n * A small, props-driven person card shown in a centred DS `Dialog`. It is built\n * only from design-system primitives (Dialog, RoundAvatar, Chip, Button,\n * Typography, Icons) so any story can drop it in with its own data — nothing\n * about a specific person is baked in.\n *\n * The face mirrors the product's person quick-look:\n * - a large circular avatar;\n * - the name in bold, immediately followed by a small grey working-hours pill;\n * - the primary email, with a trailing \"+ N more\" overflow for extra contacts;\n * - the joined date, in secondary text;\n * - a close (X) in the top-right corner;\n * - a left-aligned footer: a filled \"Send message\" and a text \"See full\n * profile\" link.\n */\n\n/* Diameter of the header avatar. ~96px per the spec, large enough to carry an\n image or two-letter initials comfortably. */\nexport const USER_DETAILS_AVATAR_SIZE = 96;\n\nexport interface UserDetailsAvatar {\n /** Background colour behind the initials (data, stands in for a real avatar). */\n color: string;\n /** Two-letter initials, shown when there is no image. */\n initials: string;\n /** Optional avatar image; when set it replaces the initials. */\n imageUrl?: string;\n}\n\nexport interface UserDetailsDialogProps {\n open: boolean;\n avatar: UserDetailsAvatar;\n name: string;\n /** A short working-hours pill next to the name, e.g. \"40 h/w\". Omit to hide. */\n hoursLabel?: string;\n email: string;\n /** Count of extra contacts, rendered as \"+ N more\". Omit / 0 to hide. */\n extraContactsCount?: number;\n /** Free-form joined line, e.g. \"Joined: Feb 7. 2009\". */\n joinedDate: string;\n onSendMessage?: () => void;\n onSeeFullProfile?: () => void;\n onClose?: () => void;\n}\n\nconst StyledHeader = styled.div`\n position: relative;\n display: flex;\n align-items: flex-start;\n gap: 16px;\n\n .udd-close {\n position: absolute;\n top: -8px;\n right: -12px;\n }\n`;\n\n/* The avatar. A plain circle — a fixed box so it never shrinks beside the info. */\nconst StyledAvatar = styled.div<{ $size: number }>`\n flex-shrink: 0;\n width: ${(props) => props.$size}px;\n height: ${(props) => props.$size}px;\n\n .udd-avatar-image {\n background-size: cover;\n background-position: center;\n color: transparent;\n }\n`;\n\nconst StyledInfo = styled.div`\n min-width: 0;\n flex: 1;\n display: flex;\n flex-direction: column;\n gap: 6px;\n padding-top: 4px;\n\n .udd-name-row {\n display: flex;\n align-items: center;\n gap: 8px;\n min-width: 0;\n }\n\n .udd-name-row > .typography {\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n }\n\n .udd-hours {\n flex-shrink: 0;\n }\n\n .udd-contact-row {\n display: flex;\n align-items: baseline;\n gap: 8px;\n min-width: 0;\n }\n\n .udd-email {\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n }\n\n .udd-more {\n flex-shrink: 0;\n }\n`;\n\n/* Dialog.Actions is only padding, so the footer lays itself out: left-aligned,\n the filled action first and the text link beside it. The link is underlined to\n match the reference. */\nconst StyledActions = styled.div`\n display: flex;\n align-items: center;\n gap: 12px;\n\n .udd-profile-link {\n text-decoration: underline;\n }\n`;\n\nexport const UserDetailsDialog = ({\n open,\n avatar,\n name,\n hoursLabel,\n email,\n extraContactsCount,\n joinedDate,\n onSendMessage,\n onSeeFullProfile,\n onClose,\n}: UserDetailsDialogProps): ReactElement => (\n <Dialog open={open} onClose={onClose} enableBackgroundClick>\n <Dialog.Content>\n <StyledHeader>\n <StyledAvatar $size={USER_DETAILS_AVATAR_SIZE}>\n <RoundAvatar\n $size={USER_DETAILS_AVATAR_SIZE}\n $bg={avatar.color}\n $bordered={false}\n className={avatar.imageUrl ? \"udd-avatar-image\" : undefined}\n style={\n avatar.imageUrl\n ? { backgroundImage: `url(${avatar.imageUrl})` }\n : undefined\n }\n >\n {avatar.imageUrl ? \"\" : avatar.initials}\n </RoundAvatar>\n </StyledAvatar>\n\n <StyledInfo>\n <div className=\"udd-name-row\">\n <Header2>{name}</Header2>\n {hoursLabel ? (\n <span className=\"udd-hours\">\n <Chip\n size=\"small\"\n label={hoursLabel}\n backgroundColor=\"var(--color-theme-300)\"\n color=\"var(--color-theme-900)\"\n />\n </span>\n ) : null}\n </div>\n\n <div className=\"udd-contact-row\">\n <Body2 color=\"secondary\" className=\"udd-email\">\n {email}\n </Body2>\n {extraContactsCount ? (\n <Body2 color=\"secondary\" className=\"udd-more\">\n + {extraContactsCount} more\n </Body2>\n ) : null}\n </div>\n\n <Caption1 color=\"secondary\">{joinedDate}</Caption1>\n </StyledInfo>\n\n <IconButton\n className=\"udd-close\"\n variant=\"text gray\"\n onClick={onClose}\n aria-label=\"Close\"\n >\n <CancelCrossIcon />\n </IconButton>\n </StyledHeader>\n </Dialog.Content>\n\n <Dialog.ContentDivider />\n\n <Dialog.Actions>\n <StyledActions>\n <Button variant=\"primary\" onClick={onSendMessage}>\n Send message\n </Button>\n <Button\n variant=\"text colored\"\n className=\"udd-profile-link\"\n onClick={onSeeFullProfile}\n >\n See full profile\n </Button>\n </StyledActions>\n </Dialog.Actions>\n </Dialog>\n);\n\nUserDetailsDialog.displayName = \"UserDetailsDialog\";\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -38,6 +38,8 @@ export { TaskOptionsMenu, TaskListOptionsMenu } from "./TaskOptionsMenu";
|
|
|
38
38
|
export type { TaskOptionsMenuProps, TaskListOptionsMenuProps, } from "./TaskOptionsMenu";
|
|
39
39
|
export { UserMenu } from "./UserMenu";
|
|
40
40
|
export type { UserMenuProps, UserMenuVariant } from "./UserMenu";
|
|
41
|
+
export { UserDetailsDialog, USER_DETAILS_AVATAR_SIZE, } from "./UserDetailsDialog";
|
|
42
|
+
export type { UserDetailsDialogProps, UserDetailsAvatar, } from "./UserDetailsDialog";
|
|
41
43
|
export { TwoFactorShield } from "./TwoFactorShield";
|
|
42
44
|
export type { TwoFactorShieldProps } from "./TwoFactorShield";
|
|
43
45
|
export { BackupCodesDialogs, CreateLoginCodeDialogs } from "./TwoFactorDialogs";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/presentation/shared/index.ts"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/presentation/shared/index.ts"],"names":[],"mappings":"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"}
|
|
@@ -24,6 +24,7 @@ export { SourceCodeSection, IssueRow, CodeRow, Spine, HistoryDialog, CompletedHe
|
|
|
24
24
|
export { SuggestSubtasksButton } from "./SuggestSubtasksButton";
|
|
25
25
|
export { TaskOptionsMenu, TaskListOptionsMenu } from "./TaskOptionsMenu";
|
|
26
26
|
export { UserMenu } from "./UserMenu";
|
|
27
|
+
export { UserDetailsDialog, USER_DETAILS_AVATAR_SIZE } from "./UserDetailsDialog";
|
|
27
28
|
export { TwoFactorShield } from "./TwoFactorShield";
|
|
28
29
|
export { BackupCodesDialogs, CreateLoginCodeDialogs } from "./TwoFactorDialogs";
|
|
29
30
|
export { SettingsHeader, SettingsContent, StyledSettingRow, RowText, SettingRow } from "./settings";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["MainLogo","RoundAvatar","PresentationShell","StyledPagePaper","PageHeader","ProjectPageHeader","TabHeader","ProjectOptionsMenu","PortfolioOptionsMenu","WidgetGrid","WidgetGroupBy","StatWidget","WidgetRankedList","OverviewWidget","AreaChartWidget","DailyDeltaChartWidget","LeaderboardWidget","StackedBarChartWidget","CHART_SERIES_COLORS","OVERVIEW_SECTION_COLORS","PERIOD_OPTIONS","PeriodPicker","FloatingControls","MessageDialog","DocLinkContext","messageComponents","MessageFeedback","POSITIVE_FEEDBACK_OPTIONS","NEGATIVE_FEEDBACK_OPTIONS","HelpAndSupportMenu","LinkingCommandsButton","LinkBranchOrPullRequestDialog","ConnectRepositoryDialog","RepositorySelect","buildRepoOptions","CONNECTIONS","PROJECT_REPOSITORIES","CONNECTABLE_REPOSITORIES","WebhookLogsDialog","WEBHOOK_CONNECTIONS","WEBHOOK_REPOSITORIES","SourceCodeSection","IssueRow","CodeRow","Spine","HistoryDialog","CompletedHeader","SuggestSubtasksButton","TaskOptionsMenu","TaskListOptionsMenu","UserMenu","TwoFactorShield","BackupCodesDialogs","CreateLoginCodeDialogs","SettingsHeader","SettingsContent","StyledSettingRow","RowText","SettingRow","FeatureAvailability","DEFAULT_FEATURE_AVAILABILITY","PORTFOLIO_TYPES","VISIBILITY_OPTIONS","DEFAULT_PORTFOLIO_FORM_VALUES","LEADERS_LIST","CATEGORIES","CLIENTS","contextFieldLabel","leaderShortName","defaultPortfolioName","isPortfolioDetailsValid","sampleProjectOptionIds","PortfolioDetailsFields","EditPortfolioDialog"],"sources":["../../../../src/presentation/shared/index.ts"],"sourcesContent":["/**\n * Shared building blocks for the Presentation mock-ups (`Presentation/*`\n * stories). The application shell, page headers, tab bar and small widgets are\n * defined once here and reused by the List view, Column view, Task sheet and\n * empty-page stories so the chrome stays identical and in one place.\n */\nexport * from \"./tokens\";\nexport { MainLogo } from \"./MainLogo\";\nexport { RoundAvatar } from \"./RoundAvatar\";\nexport { PresentationShell, StyledPagePaper } from \"./PresentationShell\";\nexport type { PresentationShellProps } from \"./PresentationShell\";\nexport { PageHeader, ProjectPageHeader, TabHeader } from \"./headers\";\nexport type {\n PageHeaderProps,\n ProjectPageHeaderProps,\n TabHeaderProps,\n} from \"./headers\";\nexport { ProjectOptionsMenu } from \"./ProjectOptionsMenu\";\nexport { PortfolioOptionsMenu } from \"./PortfolioOptionsMenu\";\nexport type { PortfolioOptionsMenuProps } from \"./PortfolioOptionsMenu\";\nexport {\n WidgetGrid,\n WidgetGroupBy,\n StatWidget,\n WidgetRankedList,\n OverviewWidget,\n AreaChartWidget,\n DailyDeltaChartWidget,\n LeaderboardWidget,\n StackedBarChartWidget,\n CHART_SERIES_COLORS,\n OVERVIEW_SECTION_COLORS,\n PERIOD_OPTIONS,\n PeriodPicker,\n} from \"./dashboardWidgets\";\nexport type {\n WidgetGroupByProps,\n StatWidgetProps,\n RankedListItem,\n OverviewSectionData,\n OverviewWidgetProps,\n AreaChartWidgetProps,\n DailyDeltaPoint,\n DailyDeltaChartWidgetProps,\n LeaderboardRowData,\n LeaderboardWidgetProps,\n StackedBarColumn,\n StackedBarChartWidgetProps,\n PeriodPickerProps,\n} from \"./dashboardWidgets\";\n\nexport type { ProjectOptionsMenuProps } from \"./ProjectOptionsMenu\";\nexport { FloatingControls } from \"./FloatingControls\";\nexport {\n MessageDialog,\n DocLinkContext,\n messageComponents,\n} from \"./MessageDialog\";\nexport type {\n MessageDialogProps,\n MessageDialogSize,\n OpenArticleHandler,\n} from \"./MessageDialog\";\nexport {\n MessageFeedback,\n POSITIVE_FEEDBACK_OPTIONS,\n NEGATIVE_FEEDBACK_OPTIONS,\n} from \"./MessageFeedback\";\nexport type {\n MessageFeedbackProps,\n MessageFeedbackResult,\n FeedbackOption,\n FeedbackSentiment,\n} from \"./MessageFeedback\";\nexport { HelpAndSupportMenu } from \"./HelpAndSupportMenu\";\nexport type { HelpAndSupportMenuProps } from \"./HelpAndSupportMenu\";\nexport { LinkingCommandsButton } from \"./LinkingCommandsButton\";\nexport { LinkBranchOrPullRequestDialog } from \"./LinkBranchOrPullRequestDialog\";\nexport type { LinkBranchOrPullRequestDialogProps } from \"./LinkBranchOrPullRequestDialog\";\nexport {\n ConnectRepositoryDialog,\n RepositorySelect,\n buildRepoOptions,\n CONNECTIONS,\n PROJECT_REPOSITORIES,\n CONNECTABLE_REPOSITORIES,\n} from \"./ConnectRepositoryDialog\";\nexport type {\n ConnectRepositoryDialogProps,\n RepositorySelectProps,\n Connection,\n ConnectionService,\n Repository,\n} from \"./ConnectRepositoryDialog\";\nexport {\n WebhookLogsDialog,\n WEBHOOK_CONNECTIONS,\n WEBHOOK_REPOSITORIES,\n} from \"./WebhookLogsDialog\";\nexport type {\n WebhookLogsDialogProps,\n WebhookConnection,\n WebhookRepository,\n WebhookLog,\n} from \"./WebhookLogsDialog\";\nexport {\n SourceCodeSection,\n IssueRow,\n CodeRow,\n Spine,\n HistoryDialog,\n CompletedHeader,\n} from \"./SourceCodeSection\";\nexport type {\n IssueEntry,\n CodeEntry,\n Stage,\n HistoryEvent,\n StageState,\n CodeStatus,\n SectionVariant,\n} from \"./SourceCodeSection\";\nexport { SuggestSubtasksButton } from \"./SuggestSubtasksButton\";\nexport { TaskOptionsMenu, TaskListOptionsMenu } from \"./TaskOptionsMenu\";\nexport type {\n TaskOptionsMenuProps,\n TaskListOptionsMenuProps,\n} from \"./TaskOptionsMenu\";\nexport { UserMenu } from \"./UserMenu\";\nexport type { UserMenuProps, UserMenuVariant } from \"./UserMenu\";\nexport { TwoFactorShield } from \"./TwoFactorShield\";\nexport type { TwoFactorShieldProps } from \"./TwoFactorShield\";\nexport { BackupCodesDialogs, CreateLoginCodeDialogs } from \"./TwoFactorDialogs\";\nexport type {\n BackupCodesDialogsProps,\n CreateLoginCodeDialogsProps,\n} from \"./TwoFactorDialogs\";\nexport {\n SettingsHeader,\n SettingsContent,\n StyledSettingRow,\n RowText,\n SettingRow,\n} from \"./settings\";\nexport type { SettingsHeaderProps, SettingRowProps } from \"./settings\";\nexport {\n FeatureAvailability,\n DEFAULT_FEATURE_AVAILABILITY,\n} from \"./FeatureAvailability\";\nexport type {\n FeatureAvailabilityProps,\n AvailabilityRow,\n AvailabilityMark,\n AvailabilityStatus,\n} from \"./FeatureAvailability\";\nexport {\n PORTFOLIO_TYPES,\n VISIBILITY_OPTIONS,\n DEFAULT_PORTFOLIO_FORM_VALUES,\n LEADERS_LIST,\n CATEGORIES,\n CLIENTS,\n contextFieldLabel,\n leaderShortName,\n defaultPortfolioName,\n isPortfolioDetailsValid,\n sampleProjectOptionIds,\n PortfolioDetailsFields,\n EditPortfolioDialog,\n} from \"./portfolioDetails\";\nexport type {\n PortfolioKind,\n PortfolioVisibility,\n GroupBy,\n PortfolioFormValues,\n PickerLeader,\n PortfolioDetailsFieldsProps,\n EditPortfolioDialogProps,\n} from \"./portfolioDetails\";\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA,cAAc,UAAU;AACxB,SAASA,QAAQ,QAAQ,YAAY;AACrC,SAASC,WAAW,QAAQ,eAAe;AAC3C,SAASC,iBAAiB,EAAEC,eAAe,QAAQ,qBAAqB;AAExE,SAASC,UAAU,EAAEC,iBAAiB,EAAEC,SAAS,QAAQ,WAAW;AAMpE,SAASC,kBAAkB,QAAQ,sBAAsB;AACzD,SAASC,oBAAoB,QAAQ,wBAAwB;AAE7D,SACEC,UAAU,EACVC,aAAa,EACbC,UAAU,EACVC,gBAAgB,EAChBC,cAAc,EACdC,eAAe,EACfC,qBAAqB,EACrBC,iBAAiB,EACjBC,qBAAqB,EACrBC,mBAAmB,EACnBC,uBAAuB,EACvBC,cAAc,EACdC,YAAY,QACP,oBAAoB;AAkB3B,SAASC,gBAAgB,QAAQ,oBAAoB;AACrD,SACEC,aAAa,EACbC,cAAc,EACdC,iBAAiB,QACZ,iBAAiB;AAMxB,SACEC,eAAe,EACfC,yBAAyB,EACzBC,yBAAyB,QACpB,mBAAmB;AAO1B,SAASC,kBAAkB,QAAQ,sBAAsB;AAEzD,SAASC,qBAAqB,QAAQ,yBAAyB;AAC/D,SAASC,6BAA6B,QAAQ,iCAAiC;AAE/E,SACEC,uBAAuB,EACvBC,gBAAgB,EAChBC,gBAAgB,EAChBC,WAAW,EACXC,oBAAoB,EACpBC,wBAAwB,QACnB,2BAA2B;AAQlC,SACEC,iBAAiB,EACjBC,mBAAmB,EACnBC,oBAAoB,QACf,qBAAqB;AAO5B,SACEC,iBAAiB,EACjBC,QAAQ,EACRC,OAAO,EACPC,KAAK,EACLC,aAAa,EACbC,eAAe,QACV,qBAAqB;AAU5B,SAASC,qBAAqB,QAAQ,yBAAyB;AAC/D,SAASC,eAAe,EAAEC,mBAAmB,QAAQ,mBAAmB;AAKxE,SAASC,QAAQ,QAAQ,YAAY;AAErC,SAASC,eAAe,QAAQ,mBAAmB;AAEnD,SAASC,kBAAkB,EAAEC,sBAAsB,QAAQ,oBAAoB;AAK/E,SACEC,cAAc,EACdC,eAAe,EACfC,gBAAgB,EAChBC,OAAO,EACPC,UAAU,QACL,YAAY;AAEnB,SACEC,mBAAmB,EACnBC,4BAA4B,QACvB,uBAAuB;AAO9B,SACEC,eAAe,EACfC,kBAAkB,EAClBC,6BAA6B,EAC7BC,YAAY,EACZC,UAAU,EACVC,OAAO,EACPC,iBAAiB,EACjBC,eAAe,EACfC,oBAAoB,EACpBC,uBAAuB,EACvBC,sBAAsB,EACtBC,sBAAsB,EACtBC,mBAAmB,QACd,oBAAoB","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"index.js","names":["MainLogo","RoundAvatar","PresentationShell","StyledPagePaper","PageHeader","ProjectPageHeader","TabHeader","ProjectOptionsMenu","PortfolioOptionsMenu","WidgetGrid","WidgetGroupBy","StatWidget","WidgetRankedList","OverviewWidget","AreaChartWidget","DailyDeltaChartWidget","LeaderboardWidget","StackedBarChartWidget","CHART_SERIES_COLORS","OVERVIEW_SECTION_COLORS","PERIOD_OPTIONS","PeriodPicker","FloatingControls","MessageDialog","DocLinkContext","messageComponents","MessageFeedback","POSITIVE_FEEDBACK_OPTIONS","NEGATIVE_FEEDBACK_OPTIONS","HelpAndSupportMenu","LinkingCommandsButton","LinkBranchOrPullRequestDialog","ConnectRepositoryDialog","RepositorySelect","buildRepoOptions","CONNECTIONS","PROJECT_REPOSITORIES","CONNECTABLE_REPOSITORIES","WebhookLogsDialog","WEBHOOK_CONNECTIONS","WEBHOOK_REPOSITORIES","SourceCodeSection","IssueRow","CodeRow","Spine","HistoryDialog","CompletedHeader","SuggestSubtasksButton","TaskOptionsMenu","TaskListOptionsMenu","UserMenu","UserDetailsDialog","USER_DETAILS_AVATAR_SIZE","TwoFactorShield","BackupCodesDialogs","CreateLoginCodeDialogs","SettingsHeader","SettingsContent","StyledSettingRow","RowText","SettingRow","FeatureAvailability","DEFAULT_FEATURE_AVAILABILITY","PORTFOLIO_TYPES","VISIBILITY_OPTIONS","DEFAULT_PORTFOLIO_FORM_VALUES","LEADERS_LIST","CATEGORIES","CLIENTS","contextFieldLabel","leaderShortName","defaultPortfolioName","isPortfolioDetailsValid","sampleProjectOptionIds","PortfolioDetailsFields","EditPortfolioDialog"],"sources":["../../../../src/presentation/shared/index.ts"],"sourcesContent":["/**\n * Shared building blocks for the Presentation mock-ups (`Presentation/*`\n * stories). The application shell, page headers, tab bar and small widgets are\n * defined once here and reused by the List view, Column view, Task sheet and\n * empty-page stories so the chrome stays identical and in one place.\n */\nexport * from \"./tokens\";\nexport { MainLogo } from \"./MainLogo\";\nexport { RoundAvatar } from \"./RoundAvatar\";\nexport { PresentationShell, StyledPagePaper } from \"./PresentationShell\";\nexport type { PresentationShellProps } from \"./PresentationShell\";\nexport { PageHeader, ProjectPageHeader, TabHeader } from \"./headers\";\nexport type {\n PageHeaderProps,\n ProjectPageHeaderProps,\n TabHeaderProps,\n} from \"./headers\";\nexport { ProjectOptionsMenu } from \"./ProjectOptionsMenu\";\nexport { PortfolioOptionsMenu } from \"./PortfolioOptionsMenu\";\nexport type { PortfolioOptionsMenuProps } from \"./PortfolioOptionsMenu\";\nexport {\n WidgetGrid,\n WidgetGroupBy,\n StatWidget,\n WidgetRankedList,\n OverviewWidget,\n AreaChartWidget,\n DailyDeltaChartWidget,\n LeaderboardWidget,\n StackedBarChartWidget,\n CHART_SERIES_COLORS,\n OVERVIEW_SECTION_COLORS,\n PERIOD_OPTIONS,\n PeriodPicker,\n} from \"./dashboardWidgets\";\nexport type {\n WidgetGroupByProps,\n StatWidgetProps,\n RankedListItem,\n OverviewSectionData,\n OverviewWidgetProps,\n AreaChartWidgetProps,\n DailyDeltaPoint,\n DailyDeltaChartWidgetProps,\n LeaderboardRowData,\n LeaderboardWidgetProps,\n StackedBarColumn,\n StackedBarChartWidgetProps,\n PeriodPickerProps,\n} from \"./dashboardWidgets\";\n\nexport type { ProjectOptionsMenuProps } from \"./ProjectOptionsMenu\";\nexport { FloatingControls } from \"./FloatingControls\";\nexport {\n MessageDialog,\n DocLinkContext,\n messageComponents,\n} from \"./MessageDialog\";\nexport type {\n MessageDialogProps,\n MessageDialogSize,\n OpenArticleHandler,\n} from \"./MessageDialog\";\nexport {\n MessageFeedback,\n POSITIVE_FEEDBACK_OPTIONS,\n NEGATIVE_FEEDBACK_OPTIONS,\n} from \"./MessageFeedback\";\nexport type {\n MessageFeedbackProps,\n MessageFeedbackResult,\n FeedbackOption,\n FeedbackSentiment,\n} from \"./MessageFeedback\";\nexport { HelpAndSupportMenu } from \"./HelpAndSupportMenu\";\nexport type { HelpAndSupportMenuProps } from \"./HelpAndSupportMenu\";\nexport { LinkingCommandsButton } from \"./LinkingCommandsButton\";\nexport { LinkBranchOrPullRequestDialog } from \"./LinkBranchOrPullRequestDialog\";\nexport type { LinkBranchOrPullRequestDialogProps } from \"./LinkBranchOrPullRequestDialog\";\nexport {\n ConnectRepositoryDialog,\n RepositorySelect,\n buildRepoOptions,\n CONNECTIONS,\n PROJECT_REPOSITORIES,\n CONNECTABLE_REPOSITORIES,\n} from \"./ConnectRepositoryDialog\";\nexport type {\n ConnectRepositoryDialogProps,\n RepositorySelectProps,\n Connection,\n ConnectionService,\n Repository,\n} from \"./ConnectRepositoryDialog\";\nexport {\n WebhookLogsDialog,\n WEBHOOK_CONNECTIONS,\n WEBHOOK_REPOSITORIES,\n} from \"./WebhookLogsDialog\";\nexport type {\n WebhookLogsDialogProps,\n WebhookConnection,\n WebhookRepository,\n WebhookLog,\n} from \"./WebhookLogsDialog\";\nexport {\n SourceCodeSection,\n IssueRow,\n CodeRow,\n Spine,\n HistoryDialog,\n CompletedHeader,\n} from \"./SourceCodeSection\";\nexport type {\n IssueEntry,\n CodeEntry,\n Stage,\n HistoryEvent,\n StageState,\n CodeStatus,\n SectionVariant,\n} from \"./SourceCodeSection\";\nexport { SuggestSubtasksButton } from \"./SuggestSubtasksButton\";\nexport { TaskOptionsMenu, TaskListOptionsMenu } from \"./TaskOptionsMenu\";\nexport type {\n TaskOptionsMenuProps,\n TaskListOptionsMenuProps,\n} from \"./TaskOptionsMenu\";\nexport { UserMenu } from \"./UserMenu\";\nexport type { UserMenuProps, UserMenuVariant } from \"./UserMenu\";\nexport {\n UserDetailsDialog,\n USER_DETAILS_AVATAR_SIZE,\n} from \"./UserDetailsDialog\";\nexport type {\n UserDetailsDialogProps,\n UserDetailsAvatar,\n} from \"./UserDetailsDialog\";\nexport { TwoFactorShield } from \"./TwoFactorShield\";\nexport type { TwoFactorShieldProps } from \"./TwoFactorShield\";\nexport { BackupCodesDialogs, CreateLoginCodeDialogs } from \"./TwoFactorDialogs\";\nexport type {\n BackupCodesDialogsProps,\n CreateLoginCodeDialogsProps,\n} from \"./TwoFactorDialogs\";\nexport {\n SettingsHeader,\n SettingsContent,\n StyledSettingRow,\n RowText,\n SettingRow,\n} from \"./settings\";\nexport type { SettingsHeaderProps, SettingRowProps } from \"./settings\";\nexport {\n FeatureAvailability,\n DEFAULT_FEATURE_AVAILABILITY,\n} from \"./FeatureAvailability\";\nexport type {\n FeatureAvailabilityProps,\n AvailabilityRow,\n AvailabilityMark,\n AvailabilityStatus,\n} from \"./FeatureAvailability\";\nexport {\n PORTFOLIO_TYPES,\n VISIBILITY_OPTIONS,\n DEFAULT_PORTFOLIO_FORM_VALUES,\n LEADERS_LIST,\n CATEGORIES,\n CLIENTS,\n contextFieldLabel,\n leaderShortName,\n defaultPortfolioName,\n isPortfolioDetailsValid,\n sampleProjectOptionIds,\n PortfolioDetailsFields,\n EditPortfolioDialog,\n} from \"./portfolioDetails\";\nexport type {\n PortfolioKind,\n PortfolioVisibility,\n GroupBy,\n PortfolioFormValues,\n PickerLeader,\n PortfolioDetailsFieldsProps,\n EditPortfolioDialogProps,\n} from \"./portfolioDetails\";\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA,cAAc,UAAU;AACxB,SAASA,QAAQ,QAAQ,YAAY;AACrC,SAASC,WAAW,QAAQ,eAAe;AAC3C,SAASC,iBAAiB,EAAEC,eAAe,QAAQ,qBAAqB;AAExE,SAASC,UAAU,EAAEC,iBAAiB,EAAEC,SAAS,QAAQ,WAAW;AAMpE,SAASC,kBAAkB,QAAQ,sBAAsB;AACzD,SAASC,oBAAoB,QAAQ,wBAAwB;AAE7D,SACEC,UAAU,EACVC,aAAa,EACbC,UAAU,EACVC,gBAAgB,EAChBC,cAAc,EACdC,eAAe,EACfC,qBAAqB,EACrBC,iBAAiB,EACjBC,qBAAqB,EACrBC,mBAAmB,EACnBC,uBAAuB,EACvBC,cAAc,EACdC,YAAY,QACP,oBAAoB;AAkB3B,SAASC,gBAAgB,QAAQ,oBAAoB;AACrD,SACEC,aAAa,EACbC,cAAc,EACdC,iBAAiB,QACZ,iBAAiB;AAMxB,SACEC,eAAe,EACfC,yBAAyB,EACzBC,yBAAyB,QACpB,mBAAmB;AAO1B,SAASC,kBAAkB,QAAQ,sBAAsB;AAEzD,SAASC,qBAAqB,QAAQ,yBAAyB;AAC/D,SAASC,6BAA6B,QAAQ,iCAAiC;AAE/E,SACEC,uBAAuB,EACvBC,gBAAgB,EAChBC,gBAAgB,EAChBC,WAAW,EACXC,oBAAoB,EACpBC,wBAAwB,QACnB,2BAA2B;AAQlC,SACEC,iBAAiB,EACjBC,mBAAmB,EACnBC,oBAAoB,QACf,qBAAqB;AAO5B,SACEC,iBAAiB,EACjBC,QAAQ,EACRC,OAAO,EACPC,KAAK,EACLC,aAAa,EACbC,eAAe,QACV,qBAAqB;AAU5B,SAASC,qBAAqB,QAAQ,yBAAyB;AAC/D,SAASC,eAAe,EAAEC,mBAAmB,QAAQ,mBAAmB;AAKxE,SAASC,QAAQ,QAAQ,YAAY;AAErC,SACEC,iBAAiB,EACjBC,wBAAwB,QACnB,qBAAqB;AAK5B,SAASC,eAAe,QAAQ,mBAAmB;AAEnD,SAASC,kBAAkB,EAAEC,sBAAsB,QAAQ,oBAAoB;AAK/E,SACEC,cAAc,EACdC,eAAe,EACfC,gBAAgB,EAChBC,OAAO,EACPC,UAAU,QACL,YAAY;AAEnB,SACEC,mBAAmB,EACnBC,4BAA4B,QACvB,uBAAuB;AAO9B,SACEC,eAAe,EACfC,kBAAkB,EAClBC,6BAA6B,EAC7BC,YAAY,EACZC,UAAU,EACVC,OAAO,EACPC,iBAAiB,EACjBC,eAAe,EACfC,oBAAoB,EACpBC,uBAAuB,EACvBC,sBAAsB,EACtBC,sBAAsB,EACtBC,mBAAmB,QACd,oBAAoB","ignoreList":[]}
|
|
@@ -17,9 +17,10 @@ export declare const TOOL_HINTS: {
|
|
|
17
17
|
readonly roundedRectangle: "Click to drop a default rectangle, or draw one to size. Press R for a rectangle.";
|
|
18
18
|
readonly triangle: "Click to drop a default triangle, or draw one to size. Press Y for a triangle.";
|
|
19
19
|
readonly connector: "Drag from one element to another to connect them. Press C to connect.";
|
|
20
|
-
readonly projectElements: "Put a task or a
|
|
20
|
+
readonly projectElements: "Put a task, a project or a person on the board — pick which above, then draw it.";
|
|
21
21
|
readonly project: "Draw a box to place a project card, then pick the project it shows.";
|
|
22
22
|
readonly task: "Draw a box to place a task card, then pick the task it shows.";
|
|
23
|
+
readonly person: "Draw a circle to place a person, then pick who it shows.";
|
|
23
24
|
readonly link: "Draw a box to place a link, or paste a URL anywhere. Press L for link.";
|
|
24
25
|
readonly file: "Draw a box to place a file, or drop one on the board. Press F for file.";
|
|
25
26
|
readonly sticky: "Click anywhere on the canvas to drop a sticky note. Press S for a sticky note.";
|
|
@@ -35,7 +36,7 @@ export type ShapeTool = "circle" | "roundedRectangle" | "triangle";
|
|
|
35
36
|
* element here" and a drag into "draw one this big"; everything else stays a
|
|
36
37
|
* mock, so the board is otherwise always in select mode.
|
|
37
38
|
*/
|
|
38
|
-
export type BoardTool = "select" | "link" | "file" | "project" | "task" | ShapeTool;
|
|
39
|
+
export type BoardTool = "select" | "link" | "file" | "project" | "task" | "person" | ShapeTool;
|
|
39
40
|
export declare const SHAPE_TOOLS: readonly ShapeTool[];
|
|
40
41
|
export declare const isShapeTool: (tool: BoardTool) => tool is ShapeTool;
|
|
41
42
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"bottomDock.d.ts","sourceRoot":"","sources":["../../../../src/presentation/whiteboard/bottomDock.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,YAAY,EAAE,SAAS,EAAY,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"bottomDock.d.ts","sourceRoot":"","sources":["../../../../src/presentation/whiteboard/bottomDock.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,YAAY,EAAE,SAAS,EAAY,MAAM,OAAO,CAAC;AA6BjE,eAAO,MAAM,WAAW,oEA2BvB,CAAC;AAGF,eAAO,MAAM,eAAe,sJAQ3B,CAAC;AAEF,eAAO,MAAM,gBAAgB,oEAU5B,CAAC;AAEF;;;;;;;GAOG;AACH,eAAO,MAAM,cAAc,oEAAwB,CAAC;AAIpD,eAAO,MAAM,UAAU,mQAQtB,CAAC;AAGF,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;CAuBb,CAAC;AAEX,MAAM,MAAM,WAAW,GAAG,MAAM,OAAO,UAAU,CAAC;AAElD,MAAM,MAAM,SAAS,GAAG,QAAQ,GAAG,kBAAkB,GAAG,UAAU,CAAC;AAEnE;;;;;GAKG;AACH,MAAM,MAAM,SAAS,GACjB,QAAQ,GACR,MAAM,GACN,MAAM,GACN,SAAS,GACT,MAAM,GACN,QAAQ,GACR,SAAS,CAAC;AAEd,eAAO,MAAM,WAAW,EAAE,SAAS,SAAS,EAI3C,CAAC;AAEF,eAAO,MAAM,WAAW,GAAI,MAAM,SAAS,KAAG,IAAI,IAAI,SACH,CAAC;AAEpD;;;;;;;;;GASG;AACH,eAAO,MAAM,kBAAkB,EAAE,SAA8B,CAAC;AAChE,eAAO,MAAM,4BAA4B,EAAE,SAAkB,CAAC;AAI9D,eAAO,MAAM,mBAAmB,EAAE,MAAM,CACtC,SAAS,EACT;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,CAKlC,CAAC;AAIF,eAAO,MAAM,mBAAmB,MAAM,CAAC;AAEvC,oDAAoD;AACpD,MAAM,MAAM,YAAY,GAAG,OAAO,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAC;AAExD,MAAM,WAAW,eAAe;IAC9B,GAAG,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,SAAS,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B;AAED,eAAO,MAAM,UAAU,GAAI,iEAOxB,eAAe,KAAG,YAYpB,CAAC;AAEF,MAAM,WAAW,eAAe;IAC9B,UAAU,EAAE,SAAS,CAAC;IACtB,YAAY,EAAE,CAAC,IAAI,EAAE,SAAS,KAAK,IAAI,CAAC;CACzC;AAMD,eAAO,MAAM,UAAU,GAAI,+BAGxB,eAAe,KAAG,YAqLpB,CAAC"}
|
|
@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
|
|
|
2
2
|
import React, { useState } from "react";
|
|
3
3
|
import styled from "styled-components";
|
|
4
4
|
import { IconButton } from "../../components/IconButton";
|
|
5
|
-
import { AttachmentIcon, CircleIcon, ConnectionIcon, DrawIcon, InsertLinkIcon, ProjectIcon, ProjectStarIcon, RoundedRectangleIcon, ShapesIcon, NoteIcon, TaskIcon, TextIcon, TriangleIcon } from "../../components/Icons";
|
|
5
|
+
import { AttachmentIcon, CircleIcon, ConnectionIcon, DrawIcon, InsertLinkIcon, PersonIcon, ProjectIcon, ProjectStarIcon, RoundedRectangleIcon, ShapesIcon, NoteIcon, TaskIcon, TextIcon, TriangleIcon } from "../../components/Icons";
|
|
6
6
|
import { Tooltip } from "../../components/Tooltip";
|
|
7
7
|
import { Caption1 } from "../../components/Typography";
|
|
8
8
|
|
|
@@ -49,9 +49,10 @@ export const TOOL_HINTS = {
|
|
|
49
49
|
roundedRectangle: "Click to drop a default rectangle, or draw one to size. Press R for a rectangle.",
|
|
50
50
|
triangle: "Click to drop a default triangle, or draw one to size. Press Y for a triangle.",
|
|
51
51
|
connector: "Drag from one element to another to connect them. Press C to connect.",
|
|
52
|
-
projectElements: "Put a task or a
|
|
52
|
+
projectElements: "Put a task, a project or a person on the board — pick which above, then draw it.",
|
|
53
53
|
project: "Draw a box to place a project card, then pick the project it shows.",
|
|
54
54
|
task: "Draw a box to place a task card, then pick the task it shows.",
|
|
55
|
+
person: "Draw a circle to place a person, then pick who it shows.",
|
|
55
56
|
link: "Draw a box to place a link, or paste a URL anywhere. Press L for link.",
|
|
56
57
|
file: "Draw a box to place a file, or drop one on the board. Press F for file.",
|
|
57
58
|
sticky: "Click anywhere on the canvas to drop a sticky note. Press S for a sticky note.",
|
|
@@ -150,7 +151,7 @@ export const BottomDock = _ref2 => {
|
|
|
150
151
|
the pill for free — another dock tool, Esc on the canvas, or the gesture
|
|
151
152
|
finishing and disarming the tool. Two states could disagree; one cannot. */
|
|
152
153
|
const shapesOpen = isShapeTool(activeTool);
|
|
153
|
-
const projectElementsOpen = activeTool === "task" || activeTool === "project";
|
|
154
|
+
const projectElementsOpen = activeTool === "task" || activeTool === "project" || activeTool === "person";
|
|
154
155
|
return /*#__PURE__*/React.createElement(StyledBottomDock, null, shapesOpen ? /*#__PURE__*/React.createElement(StyledToolPill, null, /*#__PURE__*/React.createElement(ToolButton, _extends({
|
|
155
156
|
tip: "Circle",
|
|
156
157
|
active: activeTool === "circle",
|
|
@@ -171,7 +172,11 @@ export const BottomDock = _ref2 => {
|
|
|
171
172
|
tip: "Project",
|
|
172
173
|
active: activeTool === "project",
|
|
173
174
|
onClick: () => onToolChange("project")
|
|
174
|
-
}, hoverProps("project")), /*#__PURE__*/React.createElement(ProjectIcon, null))
|
|
175
|
+
}, hoverProps("project")), /*#__PURE__*/React.createElement(ProjectIcon, null)), /*#__PURE__*/React.createElement(ToolButton, _extends({
|
|
176
|
+
tip: "User",
|
|
177
|
+
active: activeTool === "person",
|
|
178
|
+
onClick: () => onToolChange("person")
|
|
179
|
+
}, hoverProps("person")), /*#__PURE__*/React.createElement(PersonIcon, null))) : null, /*#__PURE__*/React.createElement(ToolSurface, null, /*#__PURE__*/React.createElement(Tooltip, {
|
|
175
180
|
title: "Sticky Note"
|
|
176
181
|
}, /*#__PURE__*/React.createElement(IconButton, _extends({
|
|
177
182
|
variant: "text gray",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"bottomDock.js","names":["React","useState","styled","IconButton","AttachmentIcon","CircleIcon","ConnectionIcon","DrawIcon","InsertLinkIcon","ProjectIcon","ProjectStarIcon","RoundedRectangleIcon","ShapesIcon","NoteIcon","TaskIcon","TextIcon","TriangleIcon","Tooltip","Caption1","ToolSurface","div","withConfig","displayName","componentId","verticalDivider","StyledBottomDock","StyledToolPill","StyledHint","TOOL_HINTS","circle","roundedRectangle","triangle","connector","projectElements","project","task","link","file","sticky","text","draw","shapes","SHAPE_TOOLS","isShapeTool","tool","includes","DEFAULT_SHAPE_TOOL","DEFAULT_PROJECT_ELEMENT_TOOL","SHAPE_DEFAULT_SIZES","width","height","CARD_PREVIEW_HEIGHT","ToolButton","_ref","tip","active","children","onClick","onMouseEnter","onMouseLeave","createElement","title","variant","BottomDock","_ref2","activeTool","onToolChange","_useState","hoverHint","setHoverHint","hoverProps","hint","shapesOpen","projectElementsOpen","_extends","color","className","undefined"],"sources":["../../../../src/presentation/whiteboard/bottomDock.tsx"],"sourcesContent":["import React, { ReactElement, ReactNode, useState } from \"react\";\n\nimport styled from \"styled-components\";\n\nimport { IconButton } from \"../../components/IconButton\";\nimport {\n AttachmentIcon,\n CircleIcon,\n ConnectionIcon,\n DrawIcon,\n InsertLinkIcon,\n ProjectIcon,\n ProjectStarIcon,\n RoundedRectangleIcon,\n ShapesIcon,\n NoteIcon,\n TaskIcon,\n TextIcon,\n TriangleIcon,\n} from \"../../components/Icons\";\nimport { Tooltip } from \"../../components/Tooltip\";\nimport { Caption1 } from \"../../components/Typography\";\n\n/* ------------------------------------------------------------------ */\n/* Floating toolbar surfaces */\n/* ------------------------------------------------------------------ */\n\n/* A floating, rounded toolbar surface (paper + shadow). */\nexport const ToolSurface = styled.div`\n display: flex;\n align-items: center;\n gap: 2px;\n padding: 6px;\n border-radius: 14px;\n background-color: var(--page-paper-main);\n box-shadow: 0 6px 24px rgba(0, 0, 0, 0.16);\n border: 1px solid var(--border-primary);\n\n /* A DS button colours its icon by declaring svg { fill: currentColor }, so\n every FILLED glyph follows the button's active and hover states for free.\n Three glyphs here are not filled: RoundedRectangleIcon and TriangleIcon are\n outlines with a stroke of var(--color-theme-600) baked into the path, and\n ProjectIcon draws its ruler as a stroked rect. Nothing about the button\n could ever reach them — an armed rectangle stayed exactly as grey as an\n unarmed one. This extends the same currentColor contract to a declared\n stroke.\n\n Scoped to direct children and to shapes inside a <g>, NOT to every\n descendant: ProjectIcon cuts its ruler with a <mask> whose <line> is\n stroked BLACK on purpose. In a mask only luminance matters, so recolouring\n that line would turn a clean diagonal cut into a half-transparent smear. */\n svg > [stroke],\n svg > g [stroke] {\n stroke: currentColor;\n }\n`;\n\n/* vertical separator used inside the toolbars */\nexport const verticalDivider = `\n .divider {\n width: 1px;\n height: 24px;\n background-color: var(--color-theme-400);\n margin: 0 6px;\n flex-shrink: 0;\n }\n`;\n\nexport const StyledBottomDock = styled.div`\n position: absolute;\n left: 50%;\n bottom: 18px;\n transform: translateX(-50%);\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 10px;\n max-width: calc(100% - 32px);\n`;\n\n/**\n * The floating second toolbar row — a small pill above the dock that holds the\n * members of one tool family (Circle / Rectangle / Triangle, or Task / Project).\n *\n * It is the same surface as the dock itself, so a family reads as an extension\n * of the button that opened it rather than as a different kind of UI. Only one\n * pill is ever up, because only one tool is ever armed.\n */\nexport const StyledToolPill = styled(ToolSurface)``;\n\n/* Reserve two Caption1 lines (2 × 16px) so showing/hiding the hint never\n shifts the dock; visibility keeps the reserved space when hidden. */\nexport const StyledHint = styled(Caption1)`\n text-align: center;\n padding: 0 16px;\n min-height: 32px;\n\n &.hint-hidden {\n visibility: hidden;\n }\n`;\n\n/* Per-tool hint shown under the dock only while that tool is hovered. */\nexport const TOOL_HINTS = {\n circle:\n \"Click to drop a default circle, or draw one to size. Press O for a circle.\",\n roundedRectangle:\n \"Click to drop a default rectangle, or draw one to size. Press R for a rectangle.\",\n triangle:\n \"Click to drop a default triangle, or draw one to size. Press Y for a triangle.\",\n connector:\n \"Drag from one element to another to connect them. Press C to connect.\",\n projectElements:\n \"Put a task or a project on the board — pick which above, then draw its card.\",\n project:\n \"Draw a box to place a project card, then pick the project it shows.\",\n task: \"Draw a box to place a task card, then pick the task it shows.\",\n link: \"Draw a box to place a link, or paste a URL anywhere. Press L for link.\",\n file: \"Draw a box to place a file, or drop one on the board. Press F for file.\",\n sticky:\n \"Click anywhere on the canvas to drop a sticky note. Press S for a sticky note.\",\n text: \"Click anywhere on the canvas to start typing. Press T for text.\",\n draw: \"Click and drag to draw freehand. Press D for the pen.\",\n shapes:\n \"Pick a shape above, then draw it on the board. Press R for a rectangle.\",\n} as const;\n\nexport type ToolHintKey = keyof typeof TOOL_HINTS;\n\nexport type ShapeTool = \"circle\" | \"roundedRectangle\" | \"triangle\";\n\n/**\n * The armed board tool. Link, File, Project, Task and the three shapes are\n * wired — arming one turns the next canvas click into \"drop the default-size\n * element here\" and a drag into \"draw one this big\"; everything else stays a\n * mock, so the board is otherwise always in select mode.\n */\nexport type BoardTool =\n | \"select\"\n | \"link\"\n | \"file\"\n | \"project\"\n | \"task\"\n | ShapeTool;\n\nexport const SHAPE_TOOLS: readonly ShapeTool[] = [\n \"circle\",\n \"roundedRectangle\",\n \"triangle\",\n];\n\nexport const isShapeTool = (tool: BoardTool): tool is ShapeTool =>\n (SHAPE_TOOLS as readonly string[]).includes(tool);\n\n/**\n * What a dock button arms the instant its pill opens.\n *\n * Opening a family and choosing inside it are two separate decisions, and the\n * second one has a right answer often enough that asking for it every time is\n * just a toll: a shape is usually a rectangle, and the thing people put on a\n * board is usually a task. So the pill opens with that member already armed and\n * the gesture can start immediately — picking another member is a correction,\n * not a required step.\n */\nexport const DEFAULT_SHAPE_TOOL: ShapeTool = \"roundedRectangle\";\nexport const DEFAULT_PROJECT_ELEMENT_TOOL: BoardTool = \"task\";\n\n/* What a plain click drops — mirrors DEFAULT_SHAPE_SIZES in\n new-activecollab-front, and is exactly what the hover preview promises. */\nexport const SHAPE_DEFAULT_SIZES: Record<\n ShapeTool,\n { width: number; height: number }\n> = {\n roundedRectangle: { width: 100, height: 60 },\n circle: { width: 80, height: 80 },\n triangle: { width: 80, height: 80 },\n};\n\n/* Cards are auto-height, so their hover preview uses the app's nominal wire\n height (DEFAULT_LINK_CARD_SIZE / DEFAULT_FILE_CARD_SIZE). */\nexport const CARD_PREVIEW_HEIGHT = 240;\n\n/** The kinds of card the draw gesture can place. */\nexport type DrawableTool = Exclude<BoardTool, \"select\">;\n\nexport interface ToolButtonProps {\n tip: string;\n active?: boolean;\n children: ReactNode;\n onClick?: () => void;\n onMouseEnter?: () => void;\n onMouseLeave?: () => void;\n}\n\nexport const ToolButton = ({\n tip,\n active,\n children,\n onClick,\n onMouseEnter,\n onMouseLeave,\n}: ToolButtonProps): ReactElement => (\n <Tooltip title={tip}>\n <IconButton\n variant=\"text gray\"\n active={active}\n onClick={onClick}\n onMouseEnter={onMouseEnter}\n onMouseLeave={onMouseLeave}\n >\n {children}\n </IconButton>\n </Tooltip>\n);\n\nexport interface BottomDockProps {\n activeTool: BoardTool;\n onToolChange: (tool: BoardTool) => void;\n}\n\n/* Bottom-centre tool dock: the family pill (when one is open), the main\n toolbar, and the shared hint line. The dock is anchored by its BOTTOM edge,\n so a pill appearing or disappearing grows the stack upwards and never moves\n the toolbar itself. */\nexport const BottomDock = ({\n activeTool,\n onToolChange,\n}: BottomDockProps): ReactElement => {\n const [hoverHint, setHoverHint] = useState<string | null>(null);\n\n const hoverProps = (tool: ToolHintKey): Record<string, () => void> => ({\n onMouseEnter: () => setHoverHint(TOOL_HINTS[tool]),\n onMouseLeave: () => setHoverHint(null),\n });\n\n /* An armed tool keeps its hint up after the pointer leaves the dock — the\n gesture happens on the canvas, so that is exactly when the instruction is\n needed. */\n const hint =\n hoverHint ?? (activeTool === \"select\" ? null : TOOL_HINTS[activeTool]);\n\n /* Which pill is up. Both are DERIVED from the armed tool rather than kept as\n their own open/closed state: opening a pill always arms one of its members,\n so \"a member of this family is armed\" and \"this pill is showing\" are the\n same fact. Deriving it is what makes every way of leaving the family close\n the pill for free — another dock tool, Esc on the canvas, or the gesture\n finishing and disarming the tool. Two states could disagree; one cannot. */\n const shapesOpen = isShapeTool(activeTool);\n const projectElementsOpen = activeTool === \"task\" || activeTool === \"project\";\n\n return (\n <StyledBottomDock>\n {/* Shapes pill — hidden until the Shape dock button opens it. Inside a\n pill a click is a plain choice, never a toggle off: the dock button is\n what closes the family, so clicking the armed shape again must not\n make the row that is being used disappear. */}\n {shapesOpen ? (\n <StyledToolPill>\n <ToolButton\n tip=\"Circle\"\n active={activeTool === \"circle\"}\n onClick={() => onToolChange(\"circle\")}\n {...hoverProps(\"circle\")}\n >\n <CircleIcon />\n </ToolButton>\n <ToolButton\n tip=\"Rectangle\"\n active={activeTool === \"roundedRectangle\"}\n onClick={() => onToolChange(\"roundedRectangle\")}\n {...hoverProps(\"roundedRectangle\")}\n >\n <RoundedRectangleIcon />\n </ToolButton>\n <ToolButton\n tip=\"Triangle\"\n active={activeTool === \"triangle\"}\n onClick={() => onToolChange(\"triangle\")}\n {...hoverProps(\"triangle\")}\n >\n <TriangleIcon />\n </ToolButton>\n </StyledToolPill>\n ) : null}\n\n {/* Project Elements pill — the same surface, the same button size and\n spacing, in the same slot above the dock. Task comes first because it\n is what the button arms by default. */}\n {projectElementsOpen ? (\n <StyledToolPill>\n <ToolButton\n tip=\"Task\"\n active={activeTool === \"task\"}\n onClick={() => onToolChange(\"task\")}\n {...hoverProps(\"task\")}\n >\n <TaskIcon />\n </ToolButton>\n <ToolButton\n tip=\"Project\"\n active={activeTool === \"project\"}\n onClick={() => onToolChange(\"project\")}\n {...hoverProps(\"project\")}\n >\n <ProjectIcon />\n </ToolButton>\n </StyledToolPill>\n ) : null}\n\n <ToolSurface>\n {/* The tools that are still mocks arm nothing — but they do DISARM, so\n reaching for one closes whatever pill is up and ends the gesture the\n board was waiting for. A dead button that also leaves the previous\n tool armed would be the confusing half of \"not implemented yet\". */}\n <Tooltip title=\"Sticky Note\">\n <IconButton\n variant=\"text gray\"\n onClick={() => onToolChange(\"select\")}\n {...hoverProps(\"sticky\")}\n >\n <NoteIcon />\n </IconButton>\n </Tooltip>\n <ToolButton\n tip=\"Text\"\n onClick={() => onToolChange(\"select\")}\n {...hoverProps(\"text\")}\n >\n <TextIcon />\n </ToolButton>\n <ToolButton\n tip=\"Draw\"\n onClick={() => onToolChange(\"select\")}\n {...hoverProps(\"draw\")}\n >\n <DrawIcon />\n </ToolButton>\n {/* Opening the family and arming its default member are one click: the\n pill appears with Rectangle already armed, so the next thing the\n pointer does can be the drawing itself. */}\n <ToolButton\n tip=\"Shape\"\n active={shapesOpen}\n onClick={() =>\n onToolChange(shapesOpen ? \"select\" : DEFAULT_SHAPE_TOOL)\n }\n {...hoverProps(\"shapes\")}\n >\n <ShapesIcon />\n </ToolButton>\n <ToolButton\n tip=\"Connect\"\n onClick={() => onToolChange(\"select\")}\n {...hoverProps(\"connector\")}\n >\n <ConnectionIcon />\n </ToolButton>\n <ToolButton\n tip=\"Project Elements\"\n active={projectElementsOpen}\n onClick={() =>\n onToolChange(\n projectElementsOpen ? \"select\" : DEFAULT_PROJECT_ELEMENT_TOOL\n )\n }\n {...hoverProps(\"projectElements\")}\n >\n <ProjectStarIcon />\n </ToolButton>\n <ToolButton\n tip=\"Link\"\n active={activeTool === \"link\"}\n onClick={() =>\n onToolChange(activeTool === \"link\" ? \"select\" : \"link\")\n }\n {...hoverProps(\"link\")}\n >\n <InsertLinkIcon />\n </ToolButton>\n <ToolButton\n tip=\"File\"\n active={activeTool === \"file\"}\n onClick={() =>\n onToolChange(activeTool === \"file\" ? \"select\" : \"file\")\n }\n {...hoverProps(\"file\")}\n >\n <AttachmentIcon />\n </ToolButton>\n </ToolSurface>\n\n <StyledHint color=\"tertiary\" className={hint ? undefined : \"hint-hidden\"}>\n {hint ?? \" \"}\n </StyledHint>\n </StyledBottomDock>\n );\n};\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"bottomDock.js","names":["React","useState","styled","IconButton","AttachmentIcon","CircleIcon","ConnectionIcon","DrawIcon","InsertLinkIcon","PersonIcon","ProjectIcon","ProjectStarIcon","RoundedRectangleIcon","ShapesIcon","NoteIcon","TaskIcon","TextIcon","TriangleIcon","Tooltip","Caption1","ToolSurface","div","withConfig","displayName","componentId","verticalDivider","StyledBottomDock","StyledToolPill","StyledHint","TOOL_HINTS","circle","roundedRectangle","triangle","connector","projectElements","project","task","person","link","file","sticky","text","draw","shapes","SHAPE_TOOLS","isShapeTool","tool","includes","DEFAULT_SHAPE_TOOL","DEFAULT_PROJECT_ELEMENT_TOOL","SHAPE_DEFAULT_SIZES","width","height","CARD_PREVIEW_HEIGHT","ToolButton","_ref","tip","active","children","onClick","onMouseEnter","onMouseLeave","createElement","title","variant","BottomDock","_ref2","activeTool","onToolChange","_useState","hoverHint","setHoverHint","hoverProps","hint","shapesOpen","projectElementsOpen","_extends","color","className","undefined"],"sources":["../../../../src/presentation/whiteboard/bottomDock.tsx"],"sourcesContent":["import React, { ReactElement, ReactNode, useState } from \"react\";\n\nimport styled from \"styled-components\";\n\nimport { IconButton } from \"../../components/IconButton\";\nimport {\n AttachmentIcon,\n CircleIcon,\n ConnectionIcon,\n DrawIcon,\n InsertLinkIcon,\n PersonIcon,\n ProjectIcon,\n ProjectStarIcon,\n RoundedRectangleIcon,\n ShapesIcon,\n NoteIcon,\n TaskIcon,\n TextIcon,\n TriangleIcon,\n} from \"../../components/Icons\";\nimport { Tooltip } from \"../../components/Tooltip\";\nimport { Caption1 } from \"../../components/Typography\";\n\n/* ------------------------------------------------------------------ */\n/* Floating toolbar surfaces */\n/* ------------------------------------------------------------------ */\n\n/* A floating, rounded toolbar surface (paper + shadow). */\nexport const ToolSurface = styled.div`\n display: flex;\n align-items: center;\n gap: 2px;\n padding: 6px;\n border-radius: 14px;\n background-color: var(--page-paper-main);\n box-shadow: 0 6px 24px rgba(0, 0, 0, 0.16);\n border: 1px solid var(--border-primary);\n\n /* A DS button colours its icon by declaring svg { fill: currentColor }, so\n every FILLED glyph follows the button's active and hover states for free.\n Three glyphs here are not filled: RoundedRectangleIcon and TriangleIcon are\n outlines with a stroke of var(--color-theme-600) baked into the path, and\n ProjectIcon draws its ruler as a stroked rect. Nothing about the button\n could ever reach them — an armed rectangle stayed exactly as grey as an\n unarmed one. This extends the same currentColor contract to a declared\n stroke.\n\n Scoped to direct children and to shapes inside a <g>, NOT to every\n descendant: ProjectIcon cuts its ruler with a <mask> whose <line> is\n stroked BLACK on purpose. In a mask only luminance matters, so recolouring\n that line would turn a clean diagonal cut into a half-transparent smear. */\n svg > [stroke],\n svg > g [stroke] {\n stroke: currentColor;\n }\n`;\n\n/* vertical separator used inside the toolbars */\nexport const verticalDivider = `\n .divider {\n width: 1px;\n height: 24px;\n background-color: var(--color-theme-400);\n margin: 0 6px;\n flex-shrink: 0;\n }\n`;\n\nexport const StyledBottomDock = styled.div`\n position: absolute;\n left: 50%;\n bottom: 18px;\n transform: translateX(-50%);\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 10px;\n max-width: calc(100% - 32px);\n`;\n\n/**\n * The floating second toolbar row — a small pill above the dock that holds the\n * members of one tool family (Circle / Rectangle / Triangle, or Task / Project).\n *\n * It is the same surface as the dock itself, so a family reads as an extension\n * of the button that opened it rather than as a different kind of UI. Only one\n * pill is ever up, because only one tool is ever armed.\n */\nexport const StyledToolPill = styled(ToolSurface)``;\n\n/* Reserve two Caption1 lines (2 × 16px) so showing/hiding the hint never\n shifts the dock; visibility keeps the reserved space when hidden. */\nexport const StyledHint = styled(Caption1)`\n text-align: center;\n padding: 0 16px;\n min-height: 32px;\n\n &.hint-hidden {\n visibility: hidden;\n }\n`;\n\n/* Per-tool hint shown under the dock only while that tool is hovered. */\nexport const TOOL_HINTS = {\n circle:\n \"Click to drop a default circle, or draw one to size. Press O for a circle.\",\n roundedRectangle:\n \"Click to drop a default rectangle, or draw one to size. Press R for a rectangle.\",\n triangle:\n \"Click to drop a default triangle, or draw one to size. Press Y for a triangle.\",\n connector:\n \"Drag from one element to another to connect them. Press C to connect.\",\n projectElements:\n \"Put a task, a project or a person on the board — pick which above, then draw it.\",\n project:\n \"Draw a box to place a project card, then pick the project it shows.\",\n task: \"Draw a box to place a task card, then pick the task it shows.\",\n person: \"Draw a circle to place a person, then pick who it shows.\",\n link: \"Draw a box to place a link, or paste a URL anywhere. Press L for link.\",\n file: \"Draw a box to place a file, or drop one on the board. Press F for file.\",\n sticky:\n \"Click anywhere on the canvas to drop a sticky note. Press S for a sticky note.\",\n text: \"Click anywhere on the canvas to start typing. Press T for text.\",\n draw: \"Click and drag to draw freehand. Press D for the pen.\",\n shapes:\n \"Pick a shape above, then draw it on the board. Press R for a rectangle.\",\n} as const;\n\nexport type ToolHintKey = keyof typeof TOOL_HINTS;\n\nexport type ShapeTool = \"circle\" | \"roundedRectangle\" | \"triangle\";\n\n/**\n * The armed board tool. Link, File, Project, Task and the three shapes are\n * wired — arming one turns the next canvas click into \"drop the default-size\n * element here\" and a drag into \"draw one this big\"; everything else stays a\n * mock, so the board is otherwise always in select mode.\n */\nexport type BoardTool =\n | \"select\"\n | \"link\"\n | \"file\"\n | \"project\"\n | \"task\"\n | \"person\"\n | ShapeTool;\n\nexport const SHAPE_TOOLS: readonly ShapeTool[] = [\n \"circle\",\n \"roundedRectangle\",\n \"triangle\",\n];\n\nexport const isShapeTool = (tool: BoardTool): tool is ShapeTool =>\n (SHAPE_TOOLS as readonly string[]).includes(tool);\n\n/**\n * What a dock button arms the instant its pill opens.\n *\n * Opening a family and choosing inside it are two separate decisions, and the\n * second one has a right answer often enough that asking for it every time is\n * just a toll: a shape is usually a rectangle, and the thing people put on a\n * board is usually a task. So the pill opens with that member already armed and\n * the gesture can start immediately — picking another member is a correction,\n * not a required step.\n */\nexport const DEFAULT_SHAPE_TOOL: ShapeTool = \"roundedRectangle\";\nexport const DEFAULT_PROJECT_ELEMENT_TOOL: BoardTool = \"task\";\n\n/* What a plain click drops — mirrors DEFAULT_SHAPE_SIZES in\n new-activecollab-front, and is exactly what the hover preview promises. */\nexport const SHAPE_DEFAULT_SIZES: Record<\n ShapeTool,\n { width: number; height: number }\n> = {\n roundedRectangle: { width: 100, height: 60 },\n circle: { width: 80, height: 80 },\n triangle: { width: 80, height: 80 },\n};\n\n/* Cards are auto-height, so their hover preview uses the app's nominal wire\n height (DEFAULT_LINK_CARD_SIZE / DEFAULT_FILE_CARD_SIZE). */\nexport const CARD_PREVIEW_HEIGHT = 240;\n\n/** The kinds of card the draw gesture can place. */\nexport type DrawableTool = Exclude<BoardTool, \"select\">;\n\nexport interface ToolButtonProps {\n tip: string;\n active?: boolean;\n children: ReactNode;\n onClick?: () => void;\n onMouseEnter?: () => void;\n onMouseLeave?: () => void;\n}\n\nexport const ToolButton = ({\n tip,\n active,\n children,\n onClick,\n onMouseEnter,\n onMouseLeave,\n}: ToolButtonProps): ReactElement => (\n <Tooltip title={tip}>\n <IconButton\n variant=\"text gray\"\n active={active}\n onClick={onClick}\n onMouseEnter={onMouseEnter}\n onMouseLeave={onMouseLeave}\n >\n {children}\n </IconButton>\n </Tooltip>\n);\n\nexport interface BottomDockProps {\n activeTool: BoardTool;\n onToolChange: (tool: BoardTool) => void;\n}\n\n/* Bottom-centre tool dock: the family pill (when one is open), the main\n toolbar, and the shared hint line. The dock is anchored by its BOTTOM edge,\n so a pill appearing or disappearing grows the stack upwards and never moves\n the toolbar itself. */\nexport const BottomDock = ({\n activeTool,\n onToolChange,\n}: BottomDockProps): ReactElement => {\n const [hoverHint, setHoverHint] = useState<string | null>(null);\n\n const hoverProps = (tool: ToolHintKey): Record<string, () => void> => ({\n onMouseEnter: () => setHoverHint(TOOL_HINTS[tool]),\n onMouseLeave: () => setHoverHint(null),\n });\n\n /* An armed tool keeps its hint up after the pointer leaves the dock — the\n gesture happens on the canvas, so that is exactly when the instruction is\n needed. */\n const hint =\n hoverHint ?? (activeTool === \"select\" ? null : TOOL_HINTS[activeTool]);\n\n /* Which pill is up. Both are DERIVED from the armed tool rather than kept as\n their own open/closed state: opening a pill always arms one of its members,\n so \"a member of this family is armed\" and \"this pill is showing\" are the\n same fact. Deriving it is what makes every way of leaving the family close\n the pill for free — another dock tool, Esc on the canvas, or the gesture\n finishing and disarming the tool. Two states could disagree; one cannot. */\n const shapesOpen = isShapeTool(activeTool);\n const projectElementsOpen =\n activeTool === \"task\" ||\n activeTool === \"project\" ||\n activeTool === \"person\";\n\n return (\n <StyledBottomDock>\n {/* Shapes pill — hidden until the Shape dock button opens it. Inside a\n pill a click is a plain choice, never a toggle off: the dock button is\n what closes the family, so clicking the armed shape again must not\n make the row that is being used disappear. */}\n {shapesOpen ? (\n <StyledToolPill>\n <ToolButton\n tip=\"Circle\"\n active={activeTool === \"circle\"}\n onClick={() => onToolChange(\"circle\")}\n {...hoverProps(\"circle\")}\n >\n <CircleIcon />\n </ToolButton>\n <ToolButton\n tip=\"Rectangle\"\n active={activeTool === \"roundedRectangle\"}\n onClick={() => onToolChange(\"roundedRectangle\")}\n {...hoverProps(\"roundedRectangle\")}\n >\n <RoundedRectangleIcon />\n </ToolButton>\n <ToolButton\n tip=\"Triangle\"\n active={activeTool === \"triangle\"}\n onClick={() => onToolChange(\"triangle\")}\n {...hoverProps(\"triangle\")}\n >\n <TriangleIcon />\n </ToolButton>\n </StyledToolPill>\n ) : null}\n\n {/* Project Elements pill — the same surface, the same button size and\n spacing, in the same slot above the dock. Task comes first because it\n is what the button arms by default; User is third, beside Task and\n Project, and arms the same draw gesture with a person placeholder. */}\n {projectElementsOpen ? (\n <StyledToolPill>\n <ToolButton\n tip=\"Task\"\n active={activeTool === \"task\"}\n onClick={() => onToolChange(\"task\")}\n {...hoverProps(\"task\")}\n >\n <TaskIcon />\n </ToolButton>\n <ToolButton\n tip=\"Project\"\n active={activeTool === \"project\"}\n onClick={() => onToolChange(\"project\")}\n {...hoverProps(\"project\")}\n >\n <ProjectIcon />\n </ToolButton>\n <ToolButton\n tip=\"User\"\n active={activeTool === \"person\"}\n onClick={() => onToolChange(\"person\")}\n {...hoverProps(\"person\")}\n >\n <PersonIcon />\n </ToolButton>\n </StyledToolPill>\n ) : null}\n\n <ToolSurface>\n {/* The tools that are still mocks arm nothing — but they do DISARM, so\n reaching for one closes whatever pill is up and ends the gesture the\n board was waiting for. A dead button that also leaves the previous\n tool armed would be the confusing half of \"not implemented yet\". */}\n <Tooltip title=\"Sticky Note\">\n <IconButton\n variant=\"text gray\"\n onClick={() => onToolChange(\"select\")}\n {...hoverProps(\"sticky\")}\n >\n <NoteIcon />\n </IconButton>\n </Tooltip>\n <ToolButton\n tip=\"Text\"\n onClick={() => onToolChange(\"select\")}\n {...hoverProps(\"text\")}\n >\n <TextIcon />\n </ToolButton>\n <ToolButton\n tip=\"Draw\"\n onClick={() => onToolChange(\"select\")}\n {...hoverProps(\"draw\")}\n >\n <DrawIcon />\n </ToolButton>\n {/* Opening the family and arming its default member are one click: the\n pill appears with Rectangle already armed, so the next thing the\n pointer does can be the drawing itself. */}\n <ToolButton\n tip=\"Shape\"\n active={shapesOpen}\n onClick={() =>\n onToolChange(shapesOpen ? \"select\" : DEFAULT_SHAPE_TOOL)\n }\n {...hoverProps(\"shapes\")}\n >\n <ShapesIcon />\n </ToolButton>\n <ToolButton\n tip=\"Connect\"\n onClick={() => onToolChange(\"select\")}\n {...hoverProps(\"connector\")}\n >\n <ConnectionIcon />\n </ToolButton>\n <ToolButton\n tip=\"Project Elements\"\n active={projectElementsOpen}\n onClick={() =>\n onToolChange(\n projectElementsOpen ? \"select\" : DEFAULT_PROJECT_ELEMENT_TOOL\n )\n }\n {...hoverProps(\"projectElements\")}\n >\n <ProjectStarIcon />\n </ToolButton>\n <ToolButton\n tip=\"Link\"\n active={activeTool === \"link\"}\n onClick={() =>\n onToolChange(activeTool === \"link\" ? \"select\" : \"link\")\n }\n {...hoverProps(\"link\")}\n >\n <InsertLinkIcon />\n </ToolButton>\n <ToolButton\n tip=\"File\"\n active={activeTool === \"file\"}\n onClick={() =>\n onToolChange(activeTool === \"file\" ? \"select\" : \"file\")\n }\n {...hoverProps(\"file\")}\n >\n <AttachmentIcon />\n </ToolButton>\n </ToolSurface>\n\n <StyledHint color=\"tertiary\" className={hint ? undefined : \"hint-hidden\"}>\n {hint ?? \" \"}\n </StyledHint>\n </StyledBottomDock>\n );\n};\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"canvasElements.d.ts","sourceRoot":"","sources":["../../../../src/presentation/whiteboard/canvasElements.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EACZ,YAAY,EAKb,MAAM,OAAO,CAAC;AAEf,OAAO,EACL,SAAS,EAMV,MAAM,cAAc,CAAC;AACtB,OAAO,EAEL,gBAAgB,EAChB,QAAQ,EAGR,iBAAiB,EAEjB,eAAe,EAShB,MAAM,YAAY,CAAC;
|
|
1
|
+
{"version":3,"file":"canvasElements.d.ts","sourceRoot":"","sources":["../../../../src/presentation/whiteboard/canvasElements.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EACZ,YAAY,EAKb,MAAM,OAAO,CAAC;AAEf,OAAO,EACL,SAAS,EAMV,MAAM,cAAc,CAAC;AACtB,OAAO,EAEL,gBAAgB,EAChB,QAAQ,EAGR,iBAAiB,EAEjB,eAAe,EAShB,MAAM,YAAY,CAAC;AAEpB,OAAO,EAGL,cAAc,EAIf,MAAM,eAAe,CAAC;AACvB,OAAO,EAIL,cAAc,EAMf,MAAM,eAAe,CAAC;AAEvB,OAAO,EAIL,iBAAiB,EAWlB,MAAM,mBAAmB,CAAC;AAE3B;;;;;;;;GAQG;AACH,eAAO,MAAM,gBAAgB,+CAA+C,CAAC;AAE7E;;;;;;;;;GASG;AACH,eAAO,MAAM,qBAAqB,wBAAwB,CAAC;AAE3D,MAAM,WAAW,mBAAmB;IAClC,QAAQ,EAAE,QAAQ,CAAC;IACnB,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,EAAE,SAAS,CAAC;IACtB,UAAU,EAAE,MAAM,IAAI,CAAC;IAKvB,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,kBAAkB,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,MAAM,GAAG,IAAI,CAAC,CAAC,CAAC;IAKxE,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IACpD,YAAY,EAAE,KAAK,CAAC,QAAQ,CAC1B,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,MAAM,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC,CAC/D,CAAC;IACF,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,iBAAiB,CAAC,CAAC;IAC1C,SAAS,EAAE,KAAK,CAAC,QAAQ,CACvB,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,MAAM,EAAE,iBAAiB,CAAC,CAAC,CACxD,CAAC;IACF,WAAW,EAAE,eAAe,CAAC;IAC7B,cAAc,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC,CAAC,CAAC;IAGtE,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,QAAQ,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,EAAE,CAAC,CAAC,CAAC;IACjE,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,QAAQ,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,EAAE,CAAC,CAAC,CAAC;IAGjE,eAAe,EAAE,iBAAiB,EAAE,CAAC;IACrC,kBAAkB,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,iBAAiB,EAAE,CAAC,CAAC,CAAC;IAG9E,aAAa,EAAE,gBAAgB,EAAE,CAAC;IAClC,gBAAgB,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,gBAAgB,EAAE,CAAC,CAAC,CAAC;IAE3E,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IACzD,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAGlC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC/B,QAAQ,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;CACzE;AAUD,eAAO,MAAM,cAAc,GAAI,sTAyB5B,mBAAmB,KAAG,YAitCxB,CAAC"}
|