@amboss/design-system 1.17.6 → 1.18.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/cjs/build-tokens/assets/icons.json.js +1 -1
- package/build/cjs/build-tokens/assets/icons16.json.js +1 -1
- package/build/cjs/build-tokens/visualConfig.js +12 -27
- package/build/cjs/src/components/Badge/Badge.js +2 -2
- package/build/cjs/src/components/Button/Button.js +6 -6
- package/build/cjs/src/components/DropdownMenu/MenuItem.js +2 -2
- package/build/cjs/src/components/Form/Input/Input.js +5 -5
- package/build/cjs/src/components/Form/PasswordInput/PasswordInput.js +5 -5
- package/build/cjs/src/components/Form/RadioButton/RadioButton.js +4 -4
- package/build/cjs/src/components/Form/Select/Select.js +6 -6
- package/build/cjs/src/components/Form/Textarea/Textarea.js +3 -3
- package/build/cjs/src/components/Form/ToggleButton/ToggleButton.js +5 -5
- package/build/cjs/src/components/PictogramButton/PictogramButton.js +2 -2
- package/build/cjs/src/components/RoundButton/RoundButton.js +2 -2
- package/build/cjs/src/components/Tabs/Tabs.js +3 -3
- package/build/cjs/src/components/Tag/Tag.js +4 -4
- package/build/cjs/src/components/Toggletip/Toggletip.js +3 -2
- package/build/cjs/src/components/Tooltip/BaseTooltip.js +163 -0
- package/build/cjs/src/components/Tooltip/Tooltip.js +8 -144
- package/build/cjs/src/components/Typography/Header/Header.js +12 -12
- package/build/cjs/src/components/Typography/Text/Text.js +2 -2
- package/build/cjs/src/components/UserHighlightTooltip/UserHighlightTooltip.js +15 -0
- package/build/cjs/src/index.js +2 -0
- package/build/esm/build-tokens/_sizes.json +76 -126
- package/build/esm/build-tokens/assets/icons.json +1 -0
- package/build/esm/build-tokens/assets/icons.json.js +1 -1
- package/build/esm/build-tokens/assets/icons16.json +1 -0
- package/build/esm/build-tokens/assets/icons16.json.js +1 -1
- package/build/esm/build-tokens/visualConfig.d.ts +12 -27
- package/build/esm/build-tokens/visualConfig.js +12 -27
- package/build/esm/build-tokens/visualConfig.js.map +1 -1
- package/build/esm/src/components/Badge/Badge.js +2 -2
- package/build/esm/src/components/Badge/Badge.js.map +1 -1
- package/build/esm/src/components/Button/Button.js +6 -6
- package/build/esm/src/components/Button/Button.js.map +1 -1
- package/build/esm/src/components/DropdownMenu/MenuItem.js +2 -2
- package/build/esm/src/components/DropdownMenu/MenuItem.js.map +1 -1
- package/build/esm/src/components/Form/Input/Input.js +5 -5
- package/build/esm/src/components/Form/Input/Input.js.map +1 -1
- package/build/esm/src/components/Form/PasswordInput/PasswordInput.js +5 -5
- package/build/esm/src/components/Form/PasswordInput/PasswordInput.js.map +1 -1
- package/build/esm/src/components/Form/RadioButton/RadioButton.js +4 -4
- package/build/esm/src/components/Form/RadioButton/RadioButton.js.map +1 -1
- package/build/esm/src/components/Form/Select/Select.js +6 -6
- package/build/esm/src/components/Form/Select/Select.js.map +1 -1
- package/build/esm/src/components/Form/Textarea/Textarea.js +3 -3
- package/build/esm/src/components/Form/Textarea/Textarea.js.map +1 -1
- package/build/esm/src/components/Form/ToggleButton/ToggleButton.js +5 -5
- package/build/esm/src/components/Form/ToggleButton/ToggleButton.js.map +1 -1
- package/build/esm/src/components/PictogramButton/PictogramButton.js +2 -2
- package/build/esm/src/components/PictogramButton/PictogramButton.js.map +1 -1
- package/build/esm/src/components/RoundButton/RoundButton.js +2 -2
- package/build/esm/src/components/RoundButton/RoundButton.js.map +1 -1
- package/build/esm/src/components/Tabs/Tabs.js +3 -3
- package/build/esm/src/components/Tabs/Tabs.js.map +1 -1
- package/build/esm/src/components/Tag/Tag.js +4 -4
- package/build/esm/src/components/Tag/Tag.js.map +1 -1
- package/build/esm/src/components/Toggletip/Toggletip.d.ts +5 -10
- package/build/esm/src/components/Toggletip/Toggletip.js +3 -2
- package/build/esm/src/components/Toggletip/Toggletip.js.map +1 -1
- package/build/esm/src/components/Tooltip/BaseTooltip.d.ts +11 -0
- package/build/esm/src/components/Tooltip/BaseTooltip.js +158 -0
- package/build/esm/src/components/Tooltip/BaseTooltip.js.map +1 -0
- package/build/esm/src/components/Tooltip/Tooltip.d.ts +6 -16
- package/build/esm/src/components/Tooltip/Tooltip.js +8 -145
- package/build/esm/src/components/Tooltip/Tooltip.js.map +1 -1
- package/build/esm/src/components/Tooltip/types.d.ts +8 -0
- package/build/esm/src/components/Typography/Header/Header.js +12 -12
- package/build/esm/src/components/Typography/Header/Header.js.map +1 -1
- package/build/esm/src/components/Typography/Text/Text.js +2 -2
- package/build/esm/src/components/Typography/Text/Text.js.map +1 -1
- package/build/esm/src/components/UserHighlightTooltip/UserHighlightTooltip.d.ts +4 -0
- package/build/esm/src/components/UserHighlightTooltip/UserHighlightTooltip.js +10 -0
- package/build/esm/src/components/UserHighlightTooltip/UserHighlightTooltip.js.map +1 -0
- package/build/esm/src/index.d.ts +1 -0
- package/build/esm/src/index.js +1 -0
- package/build/esm/src/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tabs.js","sources":["../../../../../src/components/Tabs/Tabs.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\n\nimport styled from \"@emotion/styled\";\nimport React from \"react\";\n\nimport { mq } from \"../../shared/mediaQueries\";\nimport { MQ, SpaceSizes } from \"../../types\";\nimport { Icon, IconName } from \"../Icon/Icon\";\nimport { Stack } from \"../Stack/Stack\";\n\nconst BORDER_BOTTOM_WIDTH = 4;\n\nconst StyledContainer = styled.div<{\n horizontalPadding: SpaceSizes | MQ<SpaceSizes>;\n}>(({ theme, horizontalPadding }) => ({\n display: \"flex\",\n flexDirection: \"row\",\n ...mq({\n gap: [[\"m\", \"l\", \"l\"], theme.variables.size.spacing],\n paddingInline: [horizontalPadding, theme.variables.size.spacing],\n }),\n\n paddingTop: theme.variables.size.spacing.m,\n borderBottom: `1px solid ${theme.values.color.border.secondary.default}`,\n\n whiteSpace: \"nowrap\",\n\n // Scrollbar\n overflow: \"auto\",\n scrollbarWidth: \"none\", // Firefox\n msOverflowStyle: \"none\", // IE 10+\n \"::-webkit-scrollbar\": {\n display: \"none\", // Chrome\n },\n}));\n\nconst StyledTab = styled.button<{ active: boolean }>(({ theme, active }) => ({\n display: \"flex\",\n gap: theme.variables.size.spacing.xxs,\n alignItems: \"center\",\n\n background: 0,\n border: 0,\n boxSizing: \"border-box\",\n color: theme.values.color.text.secondary.default,\n padding: 0,\n fontFamily: theme.variables.fontFamily.lato,\n fontWeight: theme.variables.weight.bold,\n fontSize: theme.variables.size.font.text.s,\n lineHeight: theme.variables.size.lineHeight.text.s,\n transition: \"background-color 0.15s\",\n textDecoration: \"none\",\n\n // Required to maintain consistent height for the selected tab\n borderBottom: `${BORDER_BOTTOM_WIDTH}px solid transparent`,\n paddingBottom: `calc(${theme.variables.size.spacing.m} - ${BORDER_BOTTOM_WIDTH}px)`,\n\n ...(active && {\n color: theme.values.color.text.accent.default,\n borderBottom: `${BORDER_BOTTOM_WIDTH}px solid ${theme.values.color.background.accent.default}`,\n }),\n ...(!active && {\n cursor: \"pointer\",\n \"&:hover\": {\n color: theme.values.color.text.primary.default,\n borderBottom: `${BORDER_BOTTOM_WIDTH}px solid ${theme.values.color.background.transparent.hover}`,\n },\n \"&:active\": {\n color: theme.values.color.text.primary.default,\n borderBottom: `${BORDER_BOTTOM_WIDTH}px solid ${theme.values.color.background.transparent.selected}`,\n },\n }),\n}));\n\nconst addSubtitle = (text: string) => (text ? `(${text})` : ``);\n\n/**\n * @param label - The text to display in the tab\n * @param sublabel - A subtext, encased in parentheses\n * @param icon - An icon to display to the left of the label\n * @param as - The element to render the tab as, defaults to `button`\n */\ntype Tab = {\n id?: string;\n label: string;\n sublabel?: string;\n icon?: IconName;\n as?: \"a\" | \"button\" | React.ElementType;\n} & Partial<React.ComponentProps<\"button\">> &\n Partial<React.ComponentProps<\"a\">>;\n\nexport type TabsProps = {\n /** An array of tabs, contains `header`, `subtitle`, `iconLeft`, `as` (defining the tab as a button or a link) */\n tabs: Tab[];\n children?: React.ReactElement;\n /** The index of the active tab */\n activeTab?: number;\n onTabSelect?: (selectedTab: number) => void;\n tabPanelId?: string;\n /** Horizontal padding space for the tab container, suited for tabs within a Card element */\n horizontalPadding?: SpaceSizes | MQ<SpaceSizes>; // 'm' | ['m', 'l', 'l']\n \"data-e2e-test-id\"?: string;\n};\n\nexport function Tabs({\n tabs,\n horizontalPadding,\n activeTab = 0,\n children,\n onTabSelect,\n tabPanelId = \"tabPanel\",\n \"data-e2e-test-id\": dataE2eTestId,\n}: TabsProps): React.ReactElement {\n return (\n <Stack data-e2e-test-id={dataE2eTestId} data-ds-id=\"Tabs\">\n <StyledContainer horizontalPadding={horizontalPadding} role=\"tablist\">\n {tabs.map(\n ({ id: tabId, label, sublabel, icon, as = \"button\", ...rest }, i) => (\n <StyledTab\n id={tabId || `tab-${i}`}\n type={as !== \"button\" ? undefined : \"button\"}\n role=\"tab\"\n as={as}\n key={label}\n active={activeTab === i}\n aria-selected={activeTab === i}\n aria-controls={tabPanelId}\n onClick={() => onTabSelect && onTabSelect(i)}\n {...rest}\n >\n {icon && <Icon size=\"s\" name={icon} />}\n {label} {addSubtitle(sublabel)}\n </StyledTab>\n )\n )}\n </StyledContainer>\n <div role=\"tabpanel\" id={tabPanelId}>\n {children}\n </div>\n </Stack>\n );\n}\n"],"names":["BORDER_BOTTOM_WIDTH","StyledContainer","_styled","process","env","NODE_ENV","target","label","_ref","theme","horizontalPadding","display","flexDirection","mq","gap","variables","size","spacing","paddingInline","paddingTop","m","borderBottom","values","color","border","secondary","default","whiteSpace","overflow","scrollbarWidth","msOverflowStyle","StyledTab","_ref2","active","xxs","alignItems","background","boxSizing","text","padding","fontFamily","lato","fontWeight","weight","bold","fontSize","font","s","lineHeight","transition","textDecoration","paddingBottom","accent","cursor","primary","transparent","hover","selected","addSubtitle","Tabs","_ref3","tabs","activeTab","children","onTabSelect","tabPanelId","dataE2eTestId","React","createElement","Stack","role","map","_ref4","i","id","tabId","sublabel","icon","as","rest","_extends","type","undefined","key","onClick","Icon","name"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Tabs.js","sources":["../../../../../src/components/Tabs/Tabs.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\n\nimport styled from \"@emotion/styled\";\nimport React from \"react\";\n\nimport { mq } from \"../../shared/mediaQueries\";\nimport { MQ, SpaceSizes } from \"../../types\";\nimport { Icon, IconName } from \"../Icon/Icon\";\nimport { Stack } from \"../Stack/Stack\";\n\nconst BORDER_BOTTOM_WIDTH = 4;\n\nconst StyledContainer = styled.div<{\n horizontalPadding: SpaceSizes | MQ<SpaceSizes>;\n}>(({ theme, horizontalPadding }) => ({\n display: \"flex\",\n flexDirection: \"row\",\n ...mq({\n gap: [[\"m\", \"l\", \"l\"], theme.variables.size.spacing],\n paddingInline: [horizontalPadding, theme.variables.size.spacing],\n }),\n\n paddingTop: theme.variables.size.spacing.m,\n borderBottom: `1px solid ${theme.values.color.border.secondary.default}`,\n\n whiteSpace: \"nowrap\",\n\n // Scrollbar\n overflow: \"auto\",\n scrollbarWidth: \"none\", // Firefox\n msOverflowStyle: \"none\", // IE 10+\n \"::-webkit-scrollbar\": {\n display: \"none\", // Chrome\n },\n}));\n\nconst StyledTab = styled.button<{ active: boolean }>(({ theme, active }) => ({\n display: \"flex\",\n gap: theme.variables.size.spacing.xxs,\n alignItems: \"center\",\n\n background: 0,\n border: 0,\n boxSizing: \"border-box\",\n color: theme.values.color.text.secondary.default,\n padding: 0,\n fontFamily: theme.variables.fontFamily.lato,\n fontWeight: theme.variables.weight.bold,\n fontSize: theme.variables.size.font.s,\n lineHeight: theme.variables.size.lineHeight.text.s,\n transition: \"background-color 0.15s\",\n textDecoration: \"none\",\n\n // Required to maintain consistent height for the selected tab\n borderBottom: `${BORDER_BOTTOM_WIDTH}px solid transparent`,\n paddingBottom: `calc(${theme.variables.size.spacing.m} - ${BORDER_BOTTOM_WIDTH}px)`,\n\n ...(active && {\n color: theme.values.color.text.accent.default,\n borderBottom: `${BORDER_BOTTOM_WIDTH}px solid ${theme.values.color.background.accent.default}`,\n }),\n ...(!active && {\n cursor: \"pointer\",\n \"&:hover\": {\n color: theme.values.color.text.primary.default,\n borderBottom: `${BORDER_BOTTOM_WIDTH}px solid ${theme.values.color.background.transparent.hover}`,\n },\n \"&:active\": {\n color: theme.values.color.text.primary.default,\n borderBottom: `${BORDER_BOTTOM_WIDTH}px solid ${theme.values.color.background.transparent.selected}`,\n },\n }),\n}));\n\nconst addSubtitle = (text: string) => (text ? `(${text})` : ``);\n\n/**\n * @param label - The text to display in the tab\n * @param sublabel - A subtext, encased in parentheses\n * @param icon - An icon to display to the left of the label\n * @param as - The element to render the tab as, defaults to `button`\n */\ntype Tab = {\n id?: string;\n label: string;\n sublabel?: string;\n icon?: IconName;\n as?: \"a\" | \"button\" | React.ElementType;\n} & Partial<React.ComponentProps<\"button\">> &\n Partial<React.ComponentProps<\"a\">>;\n\nexport type TabsProps = {\n /** An array of tabs, contains `header`, `subtitle`, `iconLeft`, `as` (defining the tab as a button or a link) */\n tabs: Tab[];\n children?: React.ReactElement;\n /** The index of the active tab */\n activeTab?: number;\n onTabSelect?: (selectedTab: number) => void;\n tabPanelId?: string;\n /** Horizontal padding space for the tab container, suited for tabs within a Card element */\n horizontalPadding?: SpaceSizes | MQ<SpaceSizes>; // 'm' | ['m', 'l', 'l']\n \"data-e2e-test-id\"?: string;\n};\n\nexport function Tabs({\n tabs,\n horizontalPadding,\n activeTab = 0,\n children,\n onTabSelect,\n tabPanelId = \"tabPanel\",\n \"data-e2e-test-id\": dataE2eTestId,\n}: TabsProps): React.ReactElement {\n return (\n <Stack data-e2e-test-id={dataE2eTestId} data-ds-id=\"Tabs\">\n <StyledContainer horizontalPadding={horizontalPadding} role=\"tablist\">\n {tabs.map(\n ({ id: tabId, label, sublabel, icon, as = \"button\", ...rest }, i) => (\n <StyledTab\n id={tabId || `tab-${i}`}\n type={as !== \"button\" ? undefined : \"button\"}\n role=\"tab\"\n as={as}\n key={label}\n active={activeTab === i}\n aria-selected={activeTab === i}\n aria-controls={tabPanelId}\n onClick={() => onTabSelect && onTabSelect(i)}\n {...rest}\n >\n {icon && <Icon size=\"s\" name={icon} />}\n {label} {addSubtitle(sublabel)}\n </StyledTab>\n )\n )}\n </StyledContainer>\n <div role=\"tabpanel\" id={tabPanelId}>\n {children}\n </div>\n </Stack>\n );\n}\n"],"names":["BORDER_BOTTOM_WIDTH","StyledContainer","_styled","process","env","NODE_ENV","target","label","_ref","theme","horizontalPadding","display","flexDirection","mq","gap","variables","size","spacing","paddingInline","paddingTop","m","borderBottom","values","color","border","secondary","default","whiteSpace","overflow","scrollbarWidth","msOverflowStyle","StyledTab","_ref2","active","xxs","alignItems","background","boxSizing","text","padding","fontFamily","lato","fontWeight","weight","bold","fontSize","font","s","lineHeight","transition","textDecoration","paddingBottom","accent","cursor","primary","transparent","hover","selected","addSubtitle","Tabs","_ref3","tabs","activeTab","children","onTabSelect","tabPanelId","dataE2eTestId","React","createElement","Stack","role","map","_ref4","i","id","tabId","sublabel","icon","as","rest","_extends","type","undefined","key","onClick","Icon","name"],"mappings":"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"}
|
|
@@ -26,10 +26,10 @@ const TagContainer = /*#__PURE__*/_styled("span", process.env.NODE_ENV === "prod
|
|
|
26
26
|
backgroundColor: theme.values.color.tag.background[colorVariant],
|
|
27
27
|
color: theme.values.color.tag.text[colorVariant],
|
|
28
28
|
fontFamily: theme.variables.fontFamily.lato,
|
|
29
|
-
fontSize: theme.variables.size.font.
|
|
29
|
+
fontSize: theme.variables.size.font.s,
|
|
30
30
|
lineHeight: theme.variables.size.lineHeight.text.xs
|
|
31
31
|
};
|
|
32
|
-
}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlRhZy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBeUJxQiIsImZpbGUiOiJUYWcudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBQaWN0b2dyYW1CdXR0b24gfSBmcm9tIFwiLi4vUGljdG9ncmFtQnV0dG9uL1BpY3RvZ3JhbUJ1dHRvblwiO1xuXG5leHBvcnQgY29uc3QgTUFYX1RBR19XSURUSCA9IDIwMDtcblxudHlwZSBCYXNlVGFnUHJvcHMgPSB7XG4gIGxhYmVsOiBzdHJpbmc7XG4gIGNvbG9yVmFyaWFudD86IFwiZ3JheVwiIHwgXCJibHVlXCI7XG4gIFwiZGF0YS1lMmUtdGVzdC1pZFwiPzogc3RyaW5nO1xufTtcbnR5cGUgQ29uZGl0aW9uYWxUYWdQcm9wcyA9XG4gIHwge1xuICAgICAgaXNSZW1vdmFibGU/OiBmYWxzZTtcbiAgICAgIG9uQ2xlYXI/OiBuZXZlcjtcbiAgICAgIGNsZWFyQnRuQXJpYUxhYmVsPzogbmV2ZXI7XG4gICAgfVxuICB8IHtcbiAgICAgIGlzUmVtb3ZhYmxlOiB0cnVlO1xuICAgICAgb25DbGVhcjogKCkgPT4gdm9pZDtcbiAgICAgIGNsZWFyQnRuQXJpYUxhYmVsPzogc3RyaW5nO1xuICAgIH07XG5cbmV4cG9ydCB0eXBlIFRhZ1Byb3BzID0gQmFzZVRhZ1Byb3BzICYgQ29uZGl0aW9uYWxUYWdQcm9wcztcblxuY29uc3QgVGFnQ29udGFpbmVyID0gc3R5bGVkLnNwYW48UGFydGlhbDxUYWdQcm9wcz4+KFxuICAoeyB0aGVtZSwgY29sb3JWYXJpYW50LCBpc1JlbW92YWJsZSB9KSA9PiAoe1xuICAgIGRpc3BsYXk6IFwiaW5saW5lLWZsZXhcIixcbiAgICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICAgIG1heFdpZHRoOiBgJHtNQVhfVEFHX1dJRFRIfXB4YCxcbiAgICBwYWRkaW5nTGVmdDogdGhlbWUudmFyaWFibGVzLnNpemUuc3BhY2luZy54cyxcbiAgICBwYWRkaW5nUmlnaHQ6IGlzUmVtb3ZhYmxlXG4gICAgICA/IHRoZW1lLnZhcmlhYmxlcy5zaXplLnNwYWNpbmcuemVyb1xuICAgICAgOiB0aGVtZS52YXJpYWJsZXMuc2l6ZS5zcGFjaW5nLnhzLFxuICAgIHBhZGRpbmdUb3A6IGlzUmVtb3ZhYmxlXG4gICAgICA/
|
|
32
|
+
}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlRhZy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBeUJxQiIsImZpbGUiOiJUYWcudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBQaWN0b2dyYW1CdXR0b24gfSBmcm9tIFwiLi4vUGljdG9ncmFtQnV0dG9uL1BpY3RvZ3JhbUJ1dHRvblwiO1xuXG5leHBvcnQgY29uc3QgTUFYX1RBR19XSURUSCA9IDIwMDtcblxudHlwZSBCYXNlVGFnUHJvcHMgPSB7XG4gIGxhYmVsOiBzdHJpbmc7XG4gIGNvbG9yVmFyaWFudD86IFwiZ3JheVwiIHwgXCJibHVlXCI7XG4gIFwiZGF0YS1lMmUtdGVzdC1pZFwiPzogc3RyaW5nO1xufTtcbnR5cGUgQ29uZGl0aW9uYWxUYWdQcm9wcyA9XG4gIHwge1xuICAgICAgaXNSZW1vdmFibGU/OiBmYWxzZTtcbiAgICAgIG9uQ2xlYXI/OiBuZXZlcjtcbiAgICAgIGNsZWFyQnRuQXJpYUxhYmVsPzogbmV2ZXI7XG4gICAgfVxuICB8IHtcbiAgICAgIGlzUmVtb3ZhYmxlOiB0cnVlO1xuICAgICAgb25DbGVhcjogKCkgPT4gdm9pZDtcbiAgICAgIGNsZWFyQnRuQXJpYUxhYmVsPzogc3RyaW5nO1xuICAgIH07XG5cbmV4cG9ydCB0eXBlIFRhZ1Byb3BzID0gQmFzZVRhZ1Byb3BzICYgQ29uZGl0aW9uYWxUYWdQcm9wcztcblxuY29uc3QgVGFnQ29udGFpbmVyID0gc3R5bGVkLnNwYW48UGFydGlhbDxUYWdQcm9wcz4+KFxuICAoeyB0aGVtZSwgY29sb3JWYXJpYW50LCBpc1JlbW92YWJsZSB9KSA9PiAoe1xuICAgIGRpc3BsYXk6IFwiaW5saW5lLWZsZXhcIixcbiAgICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICAgIG1heFdpZHRoOiBgJHtNQVhfVEFHX1dJRFRIfXB4YCxcbiAgICBwYWRkaW5nTGVmdDogdGhlbWUudmFyaWFibGVzLnNpemUuc3BhY2luZy54cyxcbiAgICBwYWRkaW5nUmlnaHQ6IGlzUmVtb3ZhYmxlXG4gICAgICA/IHRoZW1lLnZhcmlhYmxlcy5zaXplLnNwYWNpbmcuemVyb1xuICAgICAgOiB0aGVtZS52YXJpYWJsZXMuc2l6ZS5zcGFjaW5nLnhzLFxuICAgIHBhZGRpbmdUb3A6IGlzUmVtb3ZhYmxlXG4gICAgICA/IHRoZW1lLnZhcmlhYmxlcy5zaXplLnNwYWNpbmcuemVyb1xuICAgICAgOiB0aGVtZS52YXJpYWJsZXMuc2l6ZS5zcGFjaW5nLnh4cyxcbiAgICBwYWRkaW5nQm90dG9tOiBpc1JlbW92YWJsZVxuICAgICAgPyB0aGVtZS52YXJpYWJsZXMuc2l6ZS5zcGFjaW5nLnplcm9cbiAgICAgIDogdGhlbWUudmFyaWFibGVzLnNpemUuc3BhY2luZy54eHMsXG4gICAgYm9yZGVyUmFkaXVzOiB0aGVtZS52YXJpYWJsZXMuc2l6ZS5ib3JkZXJSYWRpdXMueHMsXG4gICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IudGFnLmJhY2tncm91bmRbY29sb3JWYXJpYW50XSxcbiAgICBjb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLnRhZy50ZXh0W2NvbG9yVmFyaWFudF0sXG4gICAgZm9udEZhbWlseTogdGhlbWUudmFyaWFibGVzLmZvbnRGYW1pbHkubGF0byxcbiAgICBmb250U2l6ZTogdGhlbWUudmFyaWFibGVzLnNpemUuZm9udC5zLFxuICAgIGxpbmVIZWlnaHQ6IHRoZW1lLnZhcmlhYmxlcy5zaXplLmxpbmVIZWlnaHQudGV4dC54cyxcbiAgfSlcbik7XG5cbmNvbnN0IFRhZ0xhYmVsID0gc3R5bGVkLnNwYW4oKCkgPT4gKHtcbiAgb3ZlcmZsb3c6IFwiaGlkZGVuXCIsXG4gIHRleHRPdmVyZmxvdzogXCJlbGxpcHNpc1wiLFxuICB3aGl0ZVNwYWNlOiBcIm5vd3JhcFwiLFxufSkpO1xuXG5jb25zdCBDbGVhckJ1dHRvbiA9IHN0eWxlZChQaWN0b2dyYW1CdXR0b24pPFBhcnRpYWw8VGFnUHJvcHM+PihcbiAgKHsgdGhlbWUsIGNvbG9yVmFyaWFudCB9KSA9PiAoe1xuICAgIGJhY2tncm91bmRDb2xvcjogXCJ0cmFuc3BhcmVudFwiLFxuICAgIGNvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IudGFnLnRleHRbY29sb3JWYXJpYW50XSxcbiAgICBcIiY6aG92ZXJcIjoge1xuICAgICAgY29sb3I6IHRoZW1lLnZhbHVlcy5jb2xvci50YWcudGV4dFtjb2xvclZhcmlhbnRdLFxuICAgIH0sXG4gIH0pXG4pO1xuXG5leHBvcnQgZnVuY3Rpb24gVGFnKHtcbiAgbGFiZWwsXG4gIGNvbG9yVmFyaWFudCA9IFwiZ3JheVwiLFxuICBpc1JlbW92YWJsZSA9IGZhbHNlLFxuICBvbkNsZWFyLFxuICBjbGVhckJ0bkFyaWFMYWJlbCxcbiAgXCJkYXRhLWUyZS10ZXN0LWlkXCI6IGRhdGFFMmVUZXN0SWQsXG59OiBUYWdQcm9wcyk6IFJlYWN0LlJlYWN0RWxlbWVudCB7XG4gIHJldHVybiAoXG4gICAgPFRhZ0NvbnRhaW5lclxuICAgICAgZGF0YS1lMmUtdGVzdC1pZD17ZGF0YUUyZVRlc3RJZH1cbiAgICAgIGRhdGEtZHMtaWQ9XCJUYWdcIlxuICAgICAgY29sb3JWYXJpYW50PXtjb2xvclZhcmlhbnR9XG4gICAgICBpc1JlbW92YWJsZT17aXNSZW1vdmFibGV9XG4gICAgPlxuICAgICAgPFRhZ0xhYmVsPntsYWJlbH08L1RhZ0xhYmVsPlxuXG4gICAgICB7aXNSZW1vdmFibGUgJiYgKFxuICAgICAgICA8Q2xlYXJCdXR0b25cbiAgICAgICAgICBpY29uPVwieFwiXG4gICAgICAgICAgc2l6ZT1cInhzXCJcbiAgICAgICAgICBhcmlhLWxhYmVsPXtjbGVhckJ0bkFyaWFMYWJlbH1cbiAgICAgICAgICBvbkNsaWNrPXtvbkNsZWFyfVxuICAgICAgICAgIGNvbG9yVmFyaWFudD17Y29sb3JWYXJpYW50fVxuICAgICAgICAvPlxuICAgICAgKX1cbiAgICA8L1RhZ0NvbnRhaW5lcj5cbiAgKTtcbn1cbiJdfQ== */");
|
|
33
33
|
const TagLabel = /*#__PURE__*/_styled("span", process.env.NODE_ENV === "production" ? {
|
|
34
34
|
target: "e1i6narj1"
|
|
35
35
|
} : {
|
|
@@ -39,7 +39,7 @@ const TagLabel = /*#__PURE__*/_styled("span", process.env.NODE_ENV === "producti
|
|
|
39
39
|
overflow: "hidden",
|
|
40
40
|
textOverflow: "ellipsis",
|
|
41
41
|
whiteSpace: "nowrap"
|
|
42
|
-
}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlRhZy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBaURpQiIsImZpbGUiOiJUYWcudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBQaWN0b2dyYW1CdXR0b24gfSBmcm9tIFwiLi4vUGljdG9ncmFtQnV0dG9uL1BpY3RvZ3JhbUJ1dHRvblwiO1xuXG5leHBvcnQgY29uc3QgTUFYX1RBR19XSURUSCA9IDIwMDtcblxudHlwZSBCYXNlVGFnUHJvcHMgPSB7XG4gIGxhYmVsOiBzdHJpbmc7XG4gIGNvbG9yVmFyaWFudD86IFwiZ3JheVwiIHwgXCJibHVlXCI7XG4gIFwiZGF0YS1lMmUtdGVzdC1pZFwiPzogc3RyaW5nO1xufTtcbnR5cGUgQ29uZGl0aW9uYWxUYWdQcm9wcyA9XG4gIHwge1xuICAgICAgaXNSZW1vdmFibGU/OiBmYWxzZTtcbiAgICAgIG9uQ2xlYXI/OiBuZXZlcjtcbiAgICAgIGNsZWFyQnRuQXJpYUxhYmVsPzogbmV2ZXI7XG4gICAgfVxuICB8IHtcbiAgICAgIGlzUmVtb3ZhYmxlOiB0cnVlO1xuICAgICAgb25DbGVhcjogKCkgPT4gdm9pZDtcbiAgICAgIGNsZWFyQnRuQXJpYUxhYmVsPzogc3RyaW5nO1xuICAgIH07XG5cbmV4cG9ydCB0eXBlIFRhZ1Byb3BzID0gQmFzZVRhZ1Byb3BzICYgQ29uZGl0aW9uYWxUYWdQcm9wcztcblxuY29uc3QgVGFnQ29udGFpbmVyID0gc3R5bGVkLnNwYW48UGFydGlhbDxUYWdQcm9wcz4+KFxuICAoeyB0aGVtZSwgY29sb3JWYXJpYW50LCBpc1JlbW92YWJsZSB9KSA9PiAoe1xuICAgIGRpc3BsYXk6IFwiaW5saW5lLWZsZXhcIixcbiAgICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICAgIG1heFdpZHRoOiBgJHtNQVhfVEFHX1dJRFRIfXB4YCxcbiAgICBwYWRkaW5nTGVmdDogdGhlbWUudmFyaWFibGVzLnNpemUuc3BhY2luZy54cyxcbiAgICBwYWRkaW5nUmlnaHQ6IGlzUmVtb3ZhYmxlXG4gICAgICA/IHRoZW1lLnZhcmlhYmxlcy5zaXplLnNwYWNpbmcuemVyb1xuICAgICAgOiB0aGVtZS52YXJpYWJsZXMuc2l6ZS5zcGFjaW5nLnhzLFxuICAgIHBhZGRpbmdUb3A6IGlzUmVtb3ZhYmxlXG4gICAgICA/
|
|
42
|
+
}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlRhZy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBaURpQiIsImZpbGUiOiJUYWcudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBQaWN0b2dyYW1CdXR0b24gfSBmcm9tIFwiLi4vUGljdG9ncmFtQnV0dG9uL1BpY3RvZ3JhbUJ1dHRvblwiO1xuXG5leHBvcnQgY29uc3QgTUFYX1RBR19XSURUSCA9IDIwMDtcblxudHlwZSBCYXNlVGFnUHJvcHMgPSB7XG4gIGxhYmVsOiBzdHJpbmc7XG4gIGNvbG9yVmFyaWFudD86IFwiZ3JheVwiIHwgXCJibHVlXCI7XG4gIFwiZGF0YS1lMmUtdGVzdC1pZFwiPzogc3RyaW5nO1xufTtcbnR5cGUgQ29uZGl0aW9uYWxUYWdQcm9wcyA9XG4gIHwge1xuICAgICAgaXNSZW1vdmFibGU/OiBmYWxzZTtcbiAgICAgIG9uQ2xlYXI/OiBuZXZlcjtcbiAgICAgIGNsZWFyQnRuQXJpYUxhYmVsPzogbmV2ZXI7XG4gICAgfVxuICB8IHtcbiAgICAgIGlzUmVtb3ZhYmxlOiB0cnVlO1xuICAgICAgb25DbGVhcjogKCkgPT4gdm9pZDtcbiAgICAgIGNsZWFyQnRuQXJpYUxhYmVsPzogc3RyaW5nO1xuICAgIH07XG5cbmV4cG9ydCB0eXBlIFRhZ1Byb3BzID0gQmFzZVRhZ1Byb3BzICYgQ29uZGl0aW9uYWxUYWdQcm9wcztcblxuY29uc3QgVGFnQ29udGFpbmVyID0gc3R5bGVkLnNwYW48UGFydGlhbDxUYWdQcm9wcz4+KFxuICAoeyB0aGVtZSwgY29sb3JWYXJpYW50LCBpc1JlbW92YWJsZSB9KSA9PiAoe1xuICAgIGRpc3BsYXk6IFwiaW5saW5lLWZsZXhcIixcbiAgICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICAgIG1heFdpZHRoOiBgJHtNQVhfVEFHX1dJRFRIfXB4YCxcbiAgICBwYWRkaW5nTGVmdDogdGhlbWUudmFyaWFibGVzLnNpemUuc3BhY2luZy54cyxcbiAgICBwYWRkaW5nUmlnaHQ6IGlzUmVtb3ZhYmxlXG4gICAgICA/IHRoZW1lLnZhcmlhYmxlcy5zaXplLnNwYWNpbmcuemVyb1xuICAgICAgOiB0aGVtZS52YXJpYWJsZXMuc2l6ZS5zcGFjaW5nLnhzLFxuICAgIHBhZGRpbmdUb3A6IGlzUmVtb3ZhYmxlXG4gICAgICA/IHRoZW1lLnZhcmlhYmxlcy5zaXplLnNwYWNpbmcuemVyb1xuICAgICAgOiB0aGVtZS52YXJpYWJsZXMuc2l6ZS5zcGFjaW5nLnh4cyxcbiAgICBwYWRkaW5nQm90dG9tOiBpc1JlbW92YWJsZVxuICAgICAgPyB0aGVtZS52YXJpYWJsZXMuc2l6ZS5zcGFjaW5nLnplcm9cbiAgICAgIDogdGhlbWUudmFyaWFibGVzLnNpemUuc3BhY2luZy54eHMsXG4gICAgYm9yZGVyUmFkaXVzOiB0aGVtZS52YXJpYWJsZXMuc2l6ZS5ib3JkZXJSYWRpdXMueHMsXG4gICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IudGFnLmJhY2tncm91bmRbY29sb3JWYXJpYW50XSxcbiAgICBjb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLnRhZy50ZXh0W2NvbG9yVmFyaWFudF0sXG4gICAgZm9udEZhbWlseTogdGhlbWUudmFyaWFibGVzLmZvbnRGYW1pbHkubGF0byxcbiAgICBmb250U2l6ZTogdGhlbWUudmFyaWFibGVzLnNpemUuZm9udC5zLFxuICAgIGxpbmVIZWlnaHQ6IHRoZW1lLnZhcmlhYmxlcy5zaXplLmxpbmVIZWlnaHQudGV4dC54cyxcbiAgfSlcbik7XG5cbmNvbnN0IFRhZ0xhYmVsID0gc3R5bGVkLnNwYW4oKCkgPT4gKHtcbiAgb3ZlcmZsb3c6IFwiaGlkZGVuXCIsXG4gIHRleHRPdmVyZmxvdzogXCJlbGxpcHNpc1wiLFxuICB3aGl0ZVNwYWNlOiBcIm5vd3JhcFwiLFxufSkpO1xuXG5jb25zdCBDbGVhckJ1dHRvbiA9IHN0eWxlZChQaWN0b2dyYW1CdXR0b24pPFBhcnRpYWw8VGFnUHJvcHM+PihcbiAgKHsgdGhlbWUsIGNvbG9yVmFyaWFudCB9KSA9PiAoe1xuICAgIGJhY2tncm91bmRDb2xvcjogXCJ0cmFuc3BhcmVudFwiLFxuICAgIGNvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IudGFnLnRleHRbY29sb3JWYXJpYW50XSxcbiAgICBcIiY6aG92ZXJcIjoge1xuICAgICAgY29sb3I6IHRoZW1lLnZhbHVlcy5jb2xvci50YWcudGV4dFtjb2xvclZhcmlhbnRdLFxuICAgIH0sXG4gIH0pXG4pO1xuXG5leHBvcnQgZnVuY3Rpb24gVGFnKHtcbiAgbGFiZWwsXG4gIGNvbG9yVmFyaWFudCA9IFwiZ3JheVwiLFxuICBpc1JlbW92YWJsZSA9IGZhbHNlLFxuICBvbkNsZWFyLFxuICBjbGVhckJ0bkFyaWFMYWJlbCxcbiAgXCJkYXRhLWUyZS10ZXN0LWlkXCI6IGRhdGFFMmVUZXN0SWQsXG59OiBUYWdQcm9wcyk6IFJlYWN0LlJlYWN0RWxlbWVudCB7XG4gIHJldHVybiAoXG4gICAgPFRhZ0NvbnRhaW5lclxuICAgICAgZGF0YS1lMmUtdGVzdC1pZD17ZGF0YUUyZVRlc3RJZH1cbiAgICAgIGRhdGEtZHMtaWQ9XCJUYWdcIlxuICAgICAgY29sb3JWYXJpYW50PXtjb2xvclZhcmlhbnR9XG4gICAgICBpc1JlbW92YWJsZT17aXNSZW1vdmFibGV9XG4gICAgPlxuICAgICAgPFRhZ0xhYmVsPntsYWJlbH08L1RhZ0xhYmVsPlxuXG4gICAgICB7aXNSZW1vdmFibGUgJiYgKFxuICAgICAgICA8Q2xlYXJCdXR0b25cbiAgICAgICAgICBpY29uPVwieFwiXG4gICAgICAgICAgc2l6ZT1cInhzXCJcbiAgICAgICAgICBhcmlhLWxhYmVsPXtjbGVhckJ0bkFyaWFMYWJlbH1cbiAgICAgICAgICBvbkNsaWNrPXtvbkNsZWFyfVxuICAgICAgICAgIGNvbG9yVmFyaWFudD17Y29sb3JWYXJpYW50fVxuICAgICAgICAvPlxuICAgICAgKX1cbiAgICA8L1RhZ0NvbnRhaW5lcj5cbiAgKTtcbn1cbiJdfQ== */");
|
|
43
43
|
const ClearButton = /*#__PURE__*/_styled(PictogramButton, process.env.NODE_ENV === "production" ? {
|
|
44
44
|
target: "e1i6narj0"
|
|
45
45
|
} : {
|
|
@@ -57,7 +57,7 @@ const ClearButton = /*#__PURE__*/_styled(PictogramButton, process.env.NODE_ENV =
|
|
|
57
57
|
color: theme.values.color.tag.text[colorVariant]
|
|
58
58
|
}
|
|
59
59
|
};
|
|
60
|
-
}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlRhZy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBdURvQiIsImZpbGUiOiJUYWcudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBQaWN0b2dyYW1CdXR0b24gfSBmcm9tIFwiLi4vUGljdG9ncmFtQnV0dG9uL1BpY3RvZ3JhbUJ1dHRvblwiO1xuXG5leHBvcnQgY29uc3QgTUFYX1RBR19XSURUSCA9IDIwMDtcblxudHlwZSBCYXNlVGFnUHJvcHMgPSB7XG4gIGxhYmVsOiBzdHJpbmc7XG4gIGNvbG9yVmFyaWFudD86IFwiZ3JheVwiIHwgXCJibHVlXCI7XG4gIFwiZGF0YS1lMmUtdGVzdC1pZFwiPzogc3RyaW5nO1xufTtcbnR5cGUgQ29uZGl0aW9uYWxUYWdQcm9wcyA9XG4gIHwge1xuICAgICAgaXNSZW1vdmFibGU/OiBmYWxzZTtcbiAgICAgIG9uQ2xlYXI/OiBuZXZlcjtcbiAgICAgIGNsZWFyQnRuQXJpYUxhYmVsPzogbmV2ZXI7XG4gICAgfVxuICB8IHtcbiAgICAgIGlzUmVtb3ZhYmxlOiB0cnVlO1xuICAgICAgb25DbGVhcjogKCkgPT4gdm9pZDtcbiAgICAgIGNsZWFyQnRuQXJpYUxhYmVsPzogc3RyaW5nO1xuICAgIH07XG5cbmV4cG9ydCB0eXBlIFRhZ1Byb3BzID0gQmFzZVRhZ1Byb3BzICYgQ29uZGl0aW9uYWxUYWdQcm9wcztcblxuY29uc3QgVGFnQ29udGFpbmVyID0gc3R5bGVkLnNwYW48UGFydGlhbDxUYWdQcm9wcz4+KFxuICAoeyB0aGVtZSwgY29sb3JWYXJpYW50LCBpc1JlbW92YWJsZSB9KSA9PiAoe1xuICAgIGRpc3BsYXk6IFwiaW5saW5lLWZsZXhcIixcbiAgICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICAgIG1heFdpZHRoOiBgJHtNQVhfVEFHX1dJRFRIfXB4YCxcbiAgICBwYWRkaW5nTGVmdDogdGhlbWUudmFyaWFibGVzLnNpemUuc3BhY2luZy54cyxcbiAgICBwYWRkaW5nUmlnaHQ6IGlzUmVtb3ZhYmxlXG4gICAgICA/IHRoZW1lLnZhcmlhYmxlcy5zaXplLnNwYWNpbmcuemVyb1xuICAgICAgOiB0aGVtZS52YXJpYWJsZXMuc2l6ZS5zcGFjaW5nLnhzLFxuICAgIHBhZGRpbmdUb3A6IGlzUmVtb3ZhYmxlXG4gICAgICA/
|
|
60
|
+
}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlRhZy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBdURvQiIsImZpbGUiOiJUYWcudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBQaWN0b2dyYW1CdXR0b24gfSBmcm9tIFwiLi4vUGljdG9ncmFtQnV0dG9uL1BpY3RvZ3JhbUJ1dHRvblwiO1xuXG5leHBvcnQgY29uc3QgTUFYX1RBR19XSURUSCA9IDIwMDtcblxudHlwZSBCYXNlVGFnUHJvcHMgPSB7XG4gIGxhYmVsOiBzdHJpbmc7XG4gIGNvbG9yVmFyaWFudD86IFwiZ3JheVwiIHwgXCJibHVlXCI7XG4gIFwiZGF0YS1lMmUtdGVzdC1pZFwiPzogc3RyaW5nO1xufTtcbnR5cGUgQ29uZGl0aW9uYWxUYWdQcm9wcyA9XG4gIHwge1xuICAgICAgaXNSZW1vdmFibGU/OiBmYWxzZTtcbiAgICAgIG9uQ2xlYXI/OiBuZXZlcjtcbiAgICAgIGNsZWFyQnRuQXJpYUxhYmVsPzogbmV2ZXI7XG4gICAgfVxuICB8IHtcbiAgICAgIGlzUmVtb3ZhYmxlOiB0cnVlO1xuICAgICAgb25DbGVhcjogKCkgPT4gdm9pZDtcbiAgICAgIGNsZWFyQnRuQXJpYUxhYmVsPzogc3RyaW5nO1xuICAgIH07XG5cbmV4cG9ydCB0eXBlIFRhZ1Byb3BzID0gQmFzZVRhZ1Byb3BzICYgQ29uZGl0aW9uYWxUYWdQcm9wcztcblxuY29uc3QgVGFnQ29udGFpbmVyID0gc3R5bGVkLnNwYW48UGFydGlhbDxUYWdQcm9wcz4+KFxuICAoeyB0aGVtZSwgY29sb3JWYXJpYW50LCBpc1JlbW92YWJsZSB9KSA9PiAoe1xuICAgIGRpc3BsYXk6IFwiaW5saW5lLWZsZXhcIixcbiAgICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICAgIG1heFdpZHRoOiBgJHtNQVhfVEFHX1dJRFRIfXB4YCxcbiAgICBwYWRkaW5nTGVmdDogdGhlbWUudmFyaWFibGVzLnNpemUuc3BhY2luZy54cyxcbiAgICBwYWRkaW5nUmlnaHQ6IGlzUmVtb3ZhYmxlXG4gICAgICA/IHRoZW1lLnZhcmlhYmxlcy5zaXplLnNwYWNpbmcuemVyb1xuICAgICAgOiB0aGVtZS52YXJpYWJsZXMuc2l6ZS5zcGFjaW5nLnhzLFxuICAgIHBhZGRpbmdUb3A6IGlzUmVtb3ZhYmxlXG4gICAgICA/IHRoZW1lLnZhcmlhYmxlcy5zaXplLnNwYWNpbmcuemVyb1xuICAgICAgOiB0aGVtZS52YXJpYWJsZXMuc2l6ZS5zcGFjaW5nLnh4cyxcbiAgICBwYWRkaW5nQm90dG9tOiBpc1JlbW92YWJsZVxuICAgICAgPyB0aGVtZS52YXJpYWJsZXMuc2l6ZS5zcGFjaW5nLnplcm9cbiAgICAgIDogdGhlbWUudmFyaWFibGVzLnNpemUuc3BhY2luZy54eHMsXG4gICAgYm9yZGVyUmFkaXVzOiB0aGVtZS52YXJpYWJsZXMuc2l6ZS5ib3JkZXJSYWRpdXMueHMsXG4gICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IudGFnLmJhY2tncm91bmRbY29sb3JWYXJpYW50XSxcbiAgICBjb2xvcjogdGhlbWUudmFsdWVzLmNvbG9yLnRhZy50ZXh0W2NvbG9yVmFyaWFudF0sXG4gICAgZm9udEZhbWlseTogdGhlbWUudmFyaWFibGVzLmZvbnRGYW1pbHkubGF0byxcbiAgICBmb250U2l6ZTogdGhlbWUudmFyaWFibGVzLnNpemUuZm9udC5zLFxuICAgIGxpbmVIZWlnaHQ6IHRoZW1lLnZhcmlhYmxlcy5zaXplLmxpbmVIZWlnaHQudGV4dC54cyxcbiAgfSlcbik7XG5cbmNvbnN0IFRhZ0xhYmVsID0gc3R5bGVkLnNwYW4oKCkgPT4gKHtcbiAgb3ZlcmZsb3c6IFwiaGlkZGVuXCIsXG4gIHRleHRPdmVyZmxvdzogXCJlbGxpcHNpc1wiLFxuICB3aGl0ZVNwYWNlOiBcIm5vd3JhcFwiLFxufSkpO1xuXG5jb25zdCBDbGVhckJ1dHRvbiA9IHN0eWxlZChQaWN0b2dyYW1CdXR0b24pPFBhcnRpYWw8VGFnUHJvcHM+PihcbiAgKHsgdGhlbWUsIGNvbG9yVmFyaWFudCB9KSA9PiAoe1xuICAgIGJhY2tncm91bmRDb2xvcjogXCJ0cmFuc3BhcmVudFwiLFxuICAgIGNvbG9yOiB0aGVtZS52YWx1ZXMuY29sb3IudGFnLnRleHRbY29sb3JWYXJpYW50XSxcbiAgICBcIiY6aG92ZXJcIjoge1xuICAgICAgY29sb3I6IHRoZW1lLnZhbHVlcy5jb2xvci50YWcudGV4dFtjb2xvclZhcmlhbnRdLFxuICAgIH0sXG4gIH0pXG4pO1xuXG5leHBvcnQgZnVuY3Rpb24gVGFnKHtcbiAgbGFiZWwsXG4gIGNvbG9yVmFyaWFudCA9IFwiZ3JheVwiLFxuICBpc1JlbW92YWJsZSA9IGZhbHNlLFxuICBvbkNsZWFyLFxuICBjbGVhckJ0bkFyaWFMYWJlbCxcbiAgXCJkYXRhLWUyZS10ZXN0LWlkXCI6IGRhdGFFMmVUZXN0SWQsXG59OiBUYWdQcm9wcyk6IFJlYWN0LlJlYWN0RWxlbWVudCB7XG4gIHJldHVybiAoXG4gICAgPFRhZ0NvbnRhaW5lclxuICAgICAgZGF0YS1lMmUtdGVzdC1pZD17ZGF0YUUyZVRlc3RJZH1cbiAgICAgIGRhdGEtZHMtaWQ9XCJUYWdcIlxuICAgICAgY29sb3JWYXJpYW50PXtjb2xvclZhcmlhbnR9XG4gICAgICBpc1JlbW92YWJsZT17aXNSZW1vdmFibGV9XG4gICAgPlxuICAgICAgPFRhZ0xhYmVsPntsYWJlbH08L1RhZ0xhYmVsPlxuXG4gICAgICB7aXNSZW1vdmFibGUgJiYgKFxuICAgICAgICA8Q2xlYXJCdXR0b25cbiAgICAgICAgICBpY29uPVwieFwiXG4gICAgICAgICAgc2l6ZT1cInhzXCJcbiAgICAgICAgICBhcmlhLWxhYmVsPXtjbGVhckJ0bkFyaWFMYWJlbH1cbiAgICAgICAgICBvbkNsaWNrPXtvbkNsZWFyfVxuICAgICAgICAgIGNvbG9yVmFyaWFudD17Y29sb3JWYXJpYW50fVxuICAgICAgICAvPlxuICAgICAgKX1cbiAgICA8L1RhZ0NvbnRhaW5lcj5cbiAgKTtcbn1cbiJdfQ== */");
|
|
61
61
|
function Tag(_ref3) {
|
|
62
62
|
let {
|
|
63
63
|
label,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tag.js","sources":["../../../../../src/components/Tag/Tag.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport { PictogramButton } from \"../PictogramButton/PictogramButton\";\n\nexport const MAX_TAG_WIDTH = 200;\n\ntype BaseTagProps = {\n label: string;\n colorVariant?: \"gray\" | \"blue\";\n \"data-e2e-test-id\"?: string;\n};\ntype ConditionalTagProps =\n | {\n isRemovable?: false;\n onClear?: never;\n clearBtnAriaLabel?: never;\n }\n | {\n isRemovable: true;\n onClear: () => void;\n clearBtnAriaLabel?: string;\n };\n\nexport type TagProps = BaseTagProps & ConditionalTagProps;\n\nconst TagContainer = styled.span<Partial<TagProps>>(\n ({ theme, colorVariant, isRemovable }) => ({\n display: \"inline-flex\",\n alignItems: \"center\",\n maxWidth: `${MAX_TAG_WIDTH}px`,\n paddingLeft: theme.variables.size.spacing.xs,\n paddingRight: isRemovable\n ? theme.variables.size.spacing.zero\n : theme.variables.size.spacing.xs,\n paddingTop: isRemovable\n ? theme.variables.size.spacing.zero\n : theme.variables.size.spacing.xxs,\n paddingBottom: isRemovable\n ? theme.variables.size.spacing.zero\n : theme.variables.size.spacing.xxs,\n borderRadius: theme.variables.size.borderRadius.xs,\n backgroundColor: theme.values.color.tag.background[colorVariant],\n color: theme.values.color.tag.text[colorVariant],\n fontFamily: theme.variables.fontFamily.lato,\n fontSize: theme.variables.size.font.
|
|
1
|
+
{"version":3,"file":"Tag.js","sources":["../../../../../src/components/Tag/Tag.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport { PictogramButton } from \"../PictogramButton/PictogramButton\";\n\nexport const MAX_TAG_WIDTH = 200;\n\ntype BaseTagProps = {\n label: string;\n colorVariant?: \"gray\" | \"blue\";\n \"data-e2e-test-id\"?: string;\n};\ntype ConditionalTagProps =\n | {\n isRemovable?: false;\n onClear?: never;\n clearBtnAriaLabel?: never;\n }\n | {\n isRemovable: true;\n onClear: () => void;\n clearBtnAriaLabel?: string;\n };\n\nexport type TagProps = BaseTagProps & ConditionalTagProps;\n\nconst TagContainer = styled.span<Partial<TagProps>>(\n ({ theme, colorVariant, isRemovable }) => ({\n display: \"inline-flex\",\n alignItems: \"center\",\n maxWidth: `${MAX_TAG_WIDTH}px`,\n paddingLeft: theme.variables.size.spacing.xs,\n paddingRight: isRemovable\n ? theme.variables.size.spacing.zero\n : theme.variables.size.spacing.xs,\n paddingTop: isRemovable\n ? theme.variables.size.spacing.zero\n : theme.variables.size.spacing.xxs,\n paddingBottom: isRemovable\n ? theme.variables.size.spacing.zero\n : theme.variables.size.spacing.xxs,\n borderRadius: theme.variables.size.borderRadius.xs,\n backgroundColor: theme.values.color.tag.background[colorVariant],\n color: theme.values.color.tag.text[colorVariant],\n fontFamily: theme.variables.fontFamily.lato,\n fontSize: theme.variables.size.font.s,\n lineHeight: theme.variables.size.lineHeight.text.xs,\n })\n);\n\nconst TagLabel = styled.span(() => ({\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n whiteSpace: \"nowrap\",\n}));\n\nconst ClearButton = styled(PictogramButton)<Partial<TagProps>>(\n ({ theme, colorVariant }) => ({\n backgroundColor: \"transparent\",\n color: theme.values.color.tag.text[colorVariant],\n \"&:hover\": {\n color: theme.values.color.tag.text[colorVariant],\n },\n })\n);\n\nexport function Tag({\n label,\n colorVariant = \"gray\",\n isRemovable = false,\n onClear,\n clearBtnAriaLabel,\n \"data-e2e-test-id\": dataE2eTestId,\n}: TagProps): React.ReactElement {\n return (\n <TagContainer\n data-e2e-test-id={dataE2eTestId}\n data-ds-id=\"Tag\"\n colorVariant={colorVariant}\n isRemovable={isRemovable}\n >\n <TagLabel>{label}</TagLabel>\n\n {isRemovable && (\n <ClearButton\n icon=\"x\"\n size=\"xs\"\n aria-label={clearBtnAriaLabel}\n onClick={onClear}\n colorVariant={colorVariant}\n />\n )}\n </TagContainer>\n );\n}\n"],"names":["MAX_TAG_WIDTH","TagContainer","_styled","process","env","NODE_ENV","target","label","_ref","theme","colorVariant","isRemovable","display","alignItems","maxWidth","paddingLeft","variables","size","spacing","xs","paddingRight","zero","paddingTop","xxs","paddingBottom","borderRadius","backgroundColor","values","color","tag","background","text","fontFamily","lato","fontSize","font","s","lineHeight","TagLabel","overflow","textOverflow","whiteSpace","ClearButton","PictogramButton","_ref2","Tag","_ref3","onClear","clearBtnAriaLabel","dataE2eTestId","React","createElement","icon","onClick"],"mappings":"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"}
|
|
@@ -1,18 +1,13 @@
|
|
|
1
|
-
import React, { ReactElement
|
|
1
|
+
import React, { ReactElement } from "react";
|
|
2
2
|
import type { TooltipContentProps } from "../Tooltip/TooltipContent";
|
|
3
|
+
import type { TooltipConditionalProps } from "../Tooltip/types";
|
|
3
4
|
type BaseProps = Pick<TooltipContentProps, "placement" | "portalContainer" | "contentPadding" | "maxWidth"> & {
|
|
4
5
|
content: ReactElement;
|
|
5
6
|
"data-e2e-test-id"?: string;
|
|
6
7
|
isVisible?: boolean;
|
|
7
8
|
onVisibilityChange?: (isVisible: boolean) => void;
|
|
9
|
+
dismissOnOutsideClick?: boolean;
|
|
8
10
|
};
|
|
9
|
-
type
|
|
10
|
-
|
|
11
|
-
children: React.ReactElement;
|
|
12
|
-
} | {
|
|
13
|
-
children?: never;
|
|
14
|
-
externalTriggerRef: MutableRefObject<any>;
|
|
15
|
-
};
|
|
16
|
-
export type ToggletipProps = BaseProps & ConditionalProps;
|
|
17
|
-
export declare function Toggletip({ placement, content, children, contentPadding, maxWidth, externalTriggerRef, portalContainer, isVisible: isToggletipVisible, "data-e2e-test-id": dataE2eTestId, onVisibilityChange, }: ToggletipProps): React.ReactElement;
|
|
11
|
+
export type ToggletipProps = BaseProps & TooltipConditionalProps;
|
|
12
|
+
export declare function Toggletip({ placement, content, children, contentPadding, maxWidth, externalTriggerRef, portalContainer, isVisible: isToggletipVisible, dismissOnOutsideClick, "data-e2e-test-id": dataE2eTestId, onVisibilityChange, }: ToggletipProps): React.ReactElement;
|
|
18
13
|
export {};
|
|
@@ -20,6 +20,7 @@ function Toggletip(_ref2) {
|
|
|
20
20
|
externalTriggerRef,
|
|
21
21
|
portalContainer,
|
|
22
22
|
isVisible: isToggletipVisible,
|
|
23
|
+
dismissOnOutsideClick = true,
|
|
23
24
|
"data-e2e-test-id": dataE2eTestId,
|
|
24
25
|
onVisibilityChange
|
|
25
26
|
} = _ref2;
|
|
@@ -94,8 +95,9 @@ function Toggletip(_ref2) {
|
|
|
94
95
|
}) : null;
|
|
95
96
|
const contentElm = /*#__PURE__*/React.createElement(FocusTrap, {
|
|
96
97
|
focusTrapOptions: {
|
|
97
|
-
clickOutsideDeactivates: handleClickOutsideDeactivates,
|
|
98
|
+
clickOutsideDeactivates: dismissOnOutsideClick && handleClickOutsideDeactivates,
|
|
98
99
|
// de-active focus trap on outside click
|
|
100
|
+
allowOutsideClick: true,
|
|
99
101
|
escapeDeactivates: true,
|
|
100
102
|
// de-activate focus trap on escape key
|
|
101
103
|
fallbackFocus: `#${tooltipId}`,
|
|
@@ -115,7 +117,6 @@ function Toggletip(_ref2) {
|
|
|
115
117
|
dataE2eTestId: dataE2eTestId,
|
|
116
118
|
isVisible: isVisible,
|
|
117
119
|
tooltipId: tooltipId,
|
|
118
|
-
tabIndex: -1,
|
|
119
120
|
triggerRef: triggerRef
|
|
120
121
|
});
|
|
121
122
|
return /*#__PURE__*/React.createElement(React.Fragment, null, triggerElm, tooltipElm);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toggletip.js","sources":["../../../../../src/components/Toggletip/Toggletip.tsx"],"sourcesContent":["import React, {\n useState,\n useRef,\n useEffect,\n useCallback,\n useMemo,\n ReactElement,\n MutableRefObject,\n PropsWithChildren,\n} from \"react\";\nimport FocusTrap from \"focus-trap-react\";\nimport type { TooltipContentProps } from \"../Tooltip/TooltipContent\";\nimport { TooltipContent } from \"../Tooltip/TooltipContent\";\n\ntype BaseProps = Pick<\n TooltipContentProps,\n \"placement\" | \"portalContainer\" | \"contentPadding\" | \"maxWidth\"\n> & {\n // Toggletip content\n content: ReactElement;\n \"data-e2e-test-id\"?: string;\n // Programmatically toggle Toggletip visibility with this prop\n isVisible?: boolean;\n /* Called when tooltip appears and disappears */\n onVisibilityChange?: (isVisible: boolean) => void;\n};\n\ntype ConditionalProps =\n | {\n externalTriggerRef?: never;\n /* Trigger element - wrap trigger element within Toggletip - takes precedence over external trigger prop */\n children: React.ReactElement;\n }\n | {\n children?: never;\n /* Trigger element ref - pass in an external trigger element */\n externalTriggerRef: MutableRefObject<any>;\n };\n\nexport type ToggletipProps = BaseProps & ConditionalProps;\n\nconst FocusTrapContent = React.forwardRef<\n HTMLDivElement,\n PropsWithChildren<unknown>\n>(({ children }, ref) => <div ref={ref}>{children}</div>);\n\nexport function Toggletip({\n placement = \"auto\",\n content,\n children,\n contentPadding = \"m\",\n maxWidth,\n externalTriggerRef,\n portalContainer,\n isVisible: isToggletipVisible,\n \"data-e2e-test-id\": dataE2eTestId,\n onVisibilityChange,\n}: ToggletipProps): React.ReactElement {\n const tooltipId = useMemo(\n () => `DSToggletip_${Math.floor(Date.now() * Math.random())}`,\n []\n );\n const [isVisible, setVisible] = useState(isToggletipVisible);\n const internalTriggerRef = useRef(null);\n const triggerRef = externalTriggerRef || internalTriggerRef;\n const isOutsideClickOnTrigger = useRef(false);\n\n const toggleVisibility = useCallback(\n (status: boolean) => {\n setVisible(status);\n\n if (onVisibilityChange) {\n onVisibilityChange(status);\n }\n },\n [onVisibilityChange]\n );\n\n // Outside click is also fired when the Toggletip is open and trigger is clicked. `isOutsideClickOnTrigger` saves this condition and we check for it so as to not toggle the Toggletip twice.\n const handleTriggerClick = useCallback(() => {\n if (!isOutsideClickOnTrigger.current) {\n toggleVisibility(!isVisible);\n } else {\n // reset this value so that Toggletip can open in next click\n isOutsideClickOnTrigger.current = false;\n }\n }, [toggleVisibility, isVisible]);\n\n const handleClickOutsideDeactivates = useCallback(\n (evt) => {\n if (triggerRef.current.contains(evt.target)) {\n isOutsideClickOnTrigger.current = true;\n }\n return true;\n },\n [triggerRef, isOutsideClickOnTrigger]\n );\n\n useEffect(() => {\n toggleVisibility(isToggletipVisible);\n }, [isToggletipVisible, toggleVisibility]);\n\n useEffect(() => {\n let trigger: HTMLElement;\n\n if (externalTriggerRef?.current && !children) {\n trigger = externalTriggerRef.current;\n\n trigger.setAttribute(\"tabindex\", \"0\");\n trigger.addEventListener(\"click\", handleTriggerClick);\n }\n\n return () => {\n if (trigger) {\n trigger.removeEventListener(\"click\", handleTriggerClick);\n }\n };\n }, [externalTriggerRef, children, handleTriggerClick]);\n\n useEffect(() => {\n if (externalTriggerRef?.current && !children) {\n const trigger = externalTriggerRef.current;\n\n if (isVisible) {\n trigger.setAttribute(\"aria-expanded\", true);\n trigger.setAttribute(\"aria-controls\", tooltipId);\n } else {\n trigger.removeAttribute(\"aria-expanded\");\n trigger.removeAttribute(\"aria-controls\");\n }\n }\n }, [externalTriggerRef, children, tooltipId, isVisible]);\n\n const triggerElm = children\n ? React.cloneElement(children, {\n ref: triggerRef,\n ...(isVisible && {\n \"aria-expanded\": true,\n \"aria-controls\": tooltipId,\n }),\n tabIndex: 0,\n onClick: (evt: React.MouseEvent) => {\n handleTriggerClick();\n if (children.props.onClick) {\n children.props.onClick(evt);\n }\n },\n })\n : null;\n\n const contentElm = (\n <FocusTrap\n focusTrapOptions={{\n clickOutsideDeactivates: handleClickOutsideDeactivates, // de-active focus trap on outside click\n escapeDeactivates: true, // de-activate focus trap on escape key\n fallbackFocus: `#${tooltipId}`, // set focus to tooltip content container if it has no focusable element\n onDeactivate: () => {\n toggleVisibility(false);\n },\n }}\n >\n <FocusTrapContent>{content}</FocusTrapContent>\n </FocusTrap>\n );\n const tooltipElm = (\n <TooltipContent\n dataDSId=\"Toggletip\"\n content={contentElm}\n contentPadding={contentPadding}\n maxWidth={maxWidth}\n placement={placement}\n portalContainer={portalContainer}\n dataE2eTestId={dataE2eTestId}\n isVisible={isVisible}\n tooltipId={tooltipId}\n tabIndex={-1}\n triggerRef={triggerRef}\n />\n );\n return (\n <>\n {triggerElm}\n {tooltipElm}\n </>\n );\n}\n"],"names":["FocusTrapContent","React","forwardRef","_ref","ref","children","createElement","Toggletip","_ref2","placement","content","contentPadding","maxWidth","externalTriggerRef","portalContainer","isVisible","isToggletipVisible","dataE2eTestId","onVisibilityChange","tooltipId","useMemo","Math","floor","Date","now","random","setVisible","useState","internalTriggerRef","useRef","triggerRef","isOutsideClickOnTrigger","toggleVisibility","useCallback","status","handleTriggerClick","current","handleClickOutsideDeactivates","evt","contains","target","useEffect","trigger","setAttribute","addEventListener","removeEventListener","removeAttribute","triggerElm","cloneElement","tabIndex","onClick","props","contentElm","FocusTrap","focusTrapOptions","clickOutsideDeactivates","escapeDeactivates","fallbackFocus","onDeactivate","tooltipElm","TooltipContent","dataDSId","Fragment"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Toggletip.js","sources":["../../../../../src/components/Toggletip/Toggletip.tsx"],"sourcesContent":["import React, {\n useState,\n useRef,\n useEffect,\n useCallback,\n useMemo,\n ReactElement,\n PropsWithChildren,\n} from \"react\";\nimport FocusTrap from \"focus-trap-react\";\nimport type { TooltipContentProps } from \"../Tooltip/TooltipContent\";\nimport { TooltipContent } from \"../Tooltip/TooltipContent\";\nimport type { TooltipConditionalProps } from \"../Tooltip/types\";\n\ntype BaseProps = Pick<\n TooltipContentProps,\n \"placement\" | \"portalContainer\" | \"contentPadding\" | \"maxWidth\"\n> & {\n // Toggletip content\n content: ReactElement;\n \"data-e2e-test-id\"?: string;\n // Programmatically toggle Toggletip visibility with this prop\n isVisible?: boolean;\n /* Called when Toggletip appears and disappears */\n onVisibilityChange?: (isVisible: boolean) => void;\n /* Controls whether Toggletip closes on outside click */\n dismissOnOutsideClick?: boolean;\n};\n\nexport type ToggletipProps = BaseProps & TooltipConditionalProps;\n\nconst FocusTrapContent = React.forwardRef<\n HTMLDivElement,\n PropsWithChildren<unknown>\n>(({ children }, ref) => <div ref={ref}>{children}</div>);\n\nexport function Toggletip({\n placement = \"auto\",\n content,\n children,\n contentPadding = \"m\",\n maxWidth,\n externalTriggerRef,\n portalContainer,\n isVisible: isToggletipVisible,\n dismissOnOutsideClick = true,\n \"data-e2e-test-id\": dataE2eTestId,\n onVisibilityChange,\n}: ToggletipProps): React.ReactElement {\n const tooltipId = useMemo(\n () => `DSToggletip_${Math.floor(Date.now() * Math.random())}`,\n []\n );\n const [isVisible, setVisible] = useState(isToggletipVisible);\n const internalTriggerRef = useRef(null);\n const triggerRef = externalTriggerRef || internalTriggerRef;\n const isOutsideClickOnTrigger = useRef(false);\n\n const toggleVisibility = useCallback(\n (status: boolean) => {\n setVisible(status);\n\n if (onVisibilityChange) {\n onVisibilityChange(status);\n }\n },\n [onVisibilityChange]\n );\n\n // Outside click is also fired when the Toggletip is open and trigger is clicked. `isOutsideClickOnTrigger` saves this condition and we check for it so as to not toggle the Toggletip twice.\n const handleTriggerClick = useCallback(() => {\n if (!isOutsideClickOnTrigger.current) {\n toggleVisibility(!isVisible);\n } else {\n // reset this value so that Toggletip can open in next click\n isOutsideClickOnTrigger.current = false;\n }\n }, [toggleVisibility, isVisible]);\n\n const handleClickOutsideDeactivates = useCallback(\n (evt) => {\n if (triggerRef.current.contains(evt.target)) {\n isOutsideClickOnTrigger.current = true;\n }\n return true;\n },\n [triggerRef, isOutsideClickOnTrigger]\n );\n\n useEffect(() => {\n toggleVisibility(isToggletipVisible);\n }, [isToggletipVisible, toggleVisibility]);\n\n useEffect(() => {\n let trigger: HTMLElement;\n\n if (externalTriggerRef?.current && !children) {\n trigger = externalTriggerRef.current;\n\n trigger.setAttribute(\"tabindex\", \"0\");\n trigger.addEventListener(\"click\", handleTriggerClick);\n }\n\n return () => {\n if (trigger) {\n trigger.removeEventListener(\"click\", handleTriggerClick);\n }\n };\n }, [externalTriggerRef, children, handleTriggerClick]);\n\n useEffect(() => {\n if (externalTriggerRef?.current && !children) {\n const trigger = externalTriggerRef.current;\n\n if (isVisible) {\n trigger.setAttribute(\"aria-expanded\", true);\n trigger.setAttribute(\"aria-controls\", tooltipId);\n } else {\n trigger.removeAttribute(\"aria-expanded\");\n trigger.removeAttribute(\"aria-controls\");\n }\n }\n }, [externalTriggerRef, children, tooltipId, isVisible]);\n\n const triggerElm = children\n ? React.cloneElement(children, {\n ref: triggerRef,\n ...(isVisible && {\n \"aria-expanded\": true,\n \"aria-controls\": tooltipId,\n }),\n tabIndex: 0,\n onClick: (evt: React.MouseEvent) => {\n handleTriggerClick();\n if (children.props.onClick) {\n children.props.onClick(evt);\n }\n },\n })\n : null;\n\n const contentElm = (\n <FocusTrap\n focusTrapOptions={{\n clickOutsideDeactivates:\n dismissOnOutsideClick && handleClickOutsideDeactivates, // de-active focus trap on outside click\n allowOutsideClick: true,\n escapeDeactivates: true, // de-activate focus trap on escape key\n fallbackFocus: `#${tooltipId}`, // set focus to tooltip content container if it has no focusable element\n onDeactivate: () => {\n toggleVisibility(false);\n },\n }}\n >\n <FocusTrapContent>{content}</FocusTrapContent>\n </FocusTrap>\n );\n const tooltipElm = (\n <TooltipContent\n dataDSId=\"Toggletip\"\n content={contentElm}\n contentPadding={contentPadding}\n maxWidth={maxWidth}\n placement={placement}\n portalContainer={portalContainer}\n dataE2eTestId={dataE2eTestId}\n isVisible={isVisible}\n tooltipId={tooltipId}\n triggerRef={triggerRef}\n />\n );\n\n return (\n <>\n {triggerElm}\n {tooltipElm}\n </>\n );\n}\n"],"names":["FocusTrapContent","React","forwardRef","_ref","ref","children","createElement","Toggletip","_ref2","placement","content","contentPadding","maxWidth","externalTriggerRef","portalContainer","isVisible","isToggletipVisible","dismissOnOutsideClick","dataE2eTestId","onVisibilityChange","tooltipId","useMemo","Math","floor","Date","now","random","setVisible","useState","internalTriggerRef","useRef","triggerRef","isOutsideClickOnTrigger","toggleVisibility","useCallback","status","handleTriggerClick","current","handleClickOutsideDeactivates","evt","contains","target","useEffect","trigger","setAttribute","addEventListener","removeEventListener","removeAttribute","triggerElm","cloneElement","tabIndex","onClick","props","contentElm","FocusTrap","focusTrapOptions","clickOutsideDeactivates","allowOutsideClick","escapeDeactivates","fallbackFocus","onDeactivate","tooltipElm","TooltipContent","dataDSId","Fragment"],"mappings":"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"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import type { TooltipContentProps } from "./TooltipContent";
|
|
3
|
+
import { TooltipConditionalProps } from "./types";
|
|
4
|
+
type BaseProps = Pick<TooltipContentProps, "placement" | "portalContainer" | "contentPadding" | "maxWidth"> & {
|
|
5
|
+
content: React.ReactElement;
|
|
6
|
+
"data-e2e-test-id"?: string;
|
|
7
|
+
onVisibilityChange?: (isVisible: boolean) => void;
|
|
8
|
+
};
|
|
9
|
+
export type BaseTooltipProps = BaseProps & TooltipConditionalProps;
|
|
10
|
+
export declare function BaseTooltip({ placement, content, children, externalTriggerRef, portalContainer, contentPadding, maxWidth, "data-e2e-test-id": dataE2eTestId, onVisibilityChange, }: BaseTooltipProps): React.ReactElement;
|
|
11
|
+
export {};
|
|
@@ -0,0 +1,158 @@
|
|
|
1
|
+
import React, { useMemo, useState, useRef, useCallback, useEffect } from 'react';
|
|
2
|
+
import { TooltipContent } from './TooltipContent.js';
|
|
3
|
+
|
|
4
|
+
const SHOW_HIDE_DELAY = 200;
|
|
5
|
+
function BaseTooltip(_ref) {
|
|
6
|
+
let {
|
|
7
|
+
placement = "auto",
|
|
8
|
+
content,
|
|
9
|
+
children,
|
|
10
|
+
externalTriggerRef,
|
|
11
|
+
portalContainer,
|
|
12
|
+
contentPadding = "m",
|
|
13
|
+
maxWidth,
|
|
14
|
+
"data-e2e-test-id": dataE2eTestId,
|
|
15
|
+
onVisibilityChange
|
|
16
|
+
} = _ref;
|
|
17
|
+
const tooltipId = useMemo(() => `DSTooltip_${Math.floor(Date.now() * Math.random())}`, []);
|
|
18
|
+
const [isVisible, setVisible] = useState(false);
|
|
19
|
+
const triggeredByEvent = useRef(null); // indicates if triggered by hover or focus
|
|
20
|
+
const isTooltipHovered = useRef(false);
|
|
21
|
+
const isTriggerHovered = useRef(false);
|
|
22
|
+
const hideTooltipTimeoutId = useRef(null);
|
|
23
|
+
const showTooltipTimeoutId = useRef(null);
|
|
24
|
+
const internalTriggerRef = useRef(null);
|
|
25
|
+
const triggerRef = externalTriggerRef || internalTriggerRef;
|
|
26
|
+
const toggleVisibility = useCallback(status => {
|
|
27
|
+
setVisible(status);
|
|
28
|
+
if (onVisibilityChange) {
|
|
29
|
+
onVisibilityChange(status);
|
|
30
|
+
}
|
|
31
|
+
}, [onVisibilityChange]);
|
|
32
|
+
const handleTriggerPointerEnter = useCallback(() => {
|
|
33
|
+
isTriggerHovered.current = true;
|
|
34
|
+
if (!isTooltipHovered.current) {
|
|
35
|
+
clearTimeout(showTooltipTimeoutId.current);
|
|
36
|
+
// Delay show tooltip to prevent flickering when mouse moves quickly over trigger
|
|
37
|
+
showTooltipTimeoutId.current = setTimeout(() => {
|
|
38
|
+
if (isTriggerHovered.current) {
|
|
39
|
+
triggeredByEvent.current = "hover";
|
|
40
|
+
toggleVisibility(true);
|
|
41
|
+
}
|
|
42
|
+
}, SHOW_HIDE_DELAY);
|
|
43
|
+
}
|
|
44
|
+
}, [toggleVisibility]);
|
|
45
|
+
const handleTriggerPointerLeave = useCallback(() => {
|
|
46
|
+
isTriggerHovered.current = false;
|
|
47
|
+
clearTimeout(hideTooltipTimeoutId.current);
|
|
48
|
+
// Delay removing tooltip from DOM to allow hover over tooltip element
|
|
49
|
+
hideTooltipTimeoutId.current = setTimeout(() => {
|
|
50
|
+
if (!isTooltipHovered.current && triggeredByEvent.current === "hover" && !isTriggerHovered.current) {
|
|
51
|
+
toggleVisibility(false);
|
|
52
|
+
}
|
|
53
|
+
}, SHOW_HIDE_DELAY);
|
|
54
|
+
}, [toggleVisibility]);
|
|
55
|
+
const handleTriggerFocus = useCallback(() => {
|
|
56
|
+
triggeredByEvent.current = "focus";
|
|
57
|
+
toggleVisibility(true);
|
|
58
|
+
}, [toggleVisibility]);
|
|
59
|
+
const handleTriggerBlur = useCallback(() => {
|
|
60
|
+
if (triggeredByEvent.current === "focus") {
|
|
61
|
+
toggleVisibility(false);
|
|
62
|
+
}
|
|
63
|
+
}, [toggleVisibility]);
|
|
64
|
+
const handleTriggerKeyDown = useCallback(evt => {
|
|
65
|
+
if (evt.key === "Escape") {
|
|
66
|
+
toggleVisibility(false);
|
|
67
|
+
}
|
|
68
|
+
}, [toggleVisibility]);
|
|
69
|
+
const handleTooltipPointerEnter = () => {
|
|
70
|
+
isTooltipHovered.current = true;
|
|
71
|
+
};
|
|
72
|
+
const handleTooltipPointerLeave = () => {
|
|
73
|
+
isTooltipHovered.current = false;
|
|
74
|
+
if (triggeredByEvent.current === "hover") {
|
|
75
|
+
toggleVisibility(false);
|
|
76
|
+
}
|
|
77
|
+
};
|
|
78
|
+
useEffect(() => () => {
|
|
79
|
+
// clear timers
|
|
80
|
+
clearTimeout(showTooltipTimeoutId.current);
|
|
81
|
+
clearTimeout(hideTooltipTimeoutId.current);
|
|
82
|
+
}, []);
|
|
83
|
+
useEffect(() => {
|
|
84
|
+
let trigger;
|
|
85
|
+
if (externalTriggerRef?.current && !children) {
|
|
86
|
+
trigger = externalTriggerRef.current;
|
|
87
|
+
trigger.setAttribute("tabindex", "0");
|
|
88
|
+
trigger.addEventListener("pointerenter", handleTriggerPointerEnter);
|
|
89
|
+
trigger.addEventListener("pointerleave", handleTriggerPointerLeave);
|
|
90
|
+
trigger.addEventListener("focus", handleTriggerFocus);
|
|
91
|
+
trigger.addEventListener("blur", handleTriggerBlur);
|
|
92
|
+
trigger.addEventListener("keydown", handleTriggerKeyDown);
|
|
93
|
+
}
|
|
94
|
+
return () => {
|
|
95
|
+
if (trigger) {
|
|
96
|
+
trigger.removeEventListener("pointerenter", handleTriggerPointerEnter);
|
|
97
|
+
trigger.removeEventListener("pointerleave", handleTriggerPointerLeave);
|
|
98
|
+
trigger.removeEventListener("focus", handleTriggerFocus);
|
|
99
|
+
trigger.removeEventListener("blur", handleTriggerBlur);
|
|
100
|
+
trigger.removeEventListener("keydown", handleTriggerKeyDown);
|
|
101
|
+
}
|
|
102
|
+
};
|
|
103
|
+
}, [externalTriggerRef, children, handleTriggerPointerEnter, handleTriggerPointerLeave, handleTriggerFocus, handleTriggerBlur, handleTriggerKeyDown]);
|
|
104
|
+
useEffect(() => {
|
|
105
|
+
if (externalTriggerRef?.current && !children) {
|
|
106
|
+
const trigger = externalTriggerRef.current;
|
|
107
|
+
if (isVisible) {
|
|
108
|
+
trigger.setAttribute("aria-describedby", tooltipId);
|
|
109
|
+
} else {
|
|
110
|
+
trigger.removeAttribute("aria-describedby");
|
|
111
|
+
}
|
|
112
|
+
}
|
|
113
|
+
}, [externalTriggerRef, children, tooltipId, isVisible]);
|
|
114
|
+
const triggerElm = children ? /*#__PURE__*/React.cloneElement(children, {
|
|
115
|
+
ref: triggerRef,
|
|
116
|
+
...(isVisible && {
|
|
117
|
+
"aria-describedby": tooltipId
|
|
118
|
+
}),
|
|
119
|
+
tabIndex: 0,
|
|
120
|
+
onPointerEnter: handleTriggerPointerEnter,
|
|
121
|
+
onPointerLeave: handleTriggerPointerLeave,
|
|
122
|
+
onFocus: evt => {
|
|
123
|
+
handleTriggerFocus();
|
|
124
|
+
if (children.props.onFocus) {
|
|
125
|
+
children.props.onFocus(evt);
|
|
126
|
+
}
|
|
127
|
+
},
|
|
128
|
+
onBlur: evt => {
|
|
129
|
+
handleTriggerBlur();
|
|
130
|
+
if (children.props.onBlur) {
|
|
131
|
+
if (children.props.onBlur) {
|
|
132
|
+
children.props.onBlur(evt);
|
|
133
|
+
}
|
|
134
|
+
}
|
|
135
|
+
},
|
|
136
|
+
onKeyDown: handleTriggerKeyDown
|
|
137
|
+
}) : null;
|
|
138
|
+
const tooltipElm = /*#__PURE__*/React.createElement(TooltipContent, {
|
|
139
|
+
dataDSId: "Tooltip",
|
|
140
|
+
content: content,
|
|
141
|
+
placement: placement,
|
|
142
|
+
portalContainer: portalContainer,
|
|
143
|
+
dataE2eTestId: dataE2eTestId,
|
|
144
|
+
isVisible: isVisible,
|
|
145
|
+
tooltipId: tooltipId,
|
|
146
|
+
triggerRef: triggerRef,
|
|
147
|
+
"aria-hidden": true,
|
|
148
|
+
role: "tooltip",
|
|
149
|
+
contentPadding: contentPadding,
|
|
150
|
+
maxWidth: maxWidth,
|
|
151
|
+
onTooltipPointerEnter: handleTooltipPointerEnter,
|
|
152
|
+
onTooltipPointerLeave: handleTooltipPointerLeave
|
|
153
|
+
});
|
|
154
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, triggerElm, tooltipElm);
|
|
155
|
+
}
|
|
156
|
+
|
|
157
|
+
export { BaseTooltip };
|
|
158
|
+
//# sourceMappingURL=BaseTooltip.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BaseTooltip.js","sources":["../../../../../src/components/Tooltip/BaseTooltip.tsx"],"sourcesContent":["import React, {\n useState,\n useRef,\n useEffect,\n useCallback,\n useMemo,\n} from \"react\";\nimport type { TooltipContentProps } from \"./TooltipContent\";\nimport { TooltipContent } from \"./TooltipContent\";\nimport { TooltipConditionalProps } from \"./types\";\n\ntype BaseProps = Pick<\n TooltipContentProps,\n \"placement\" | \"portalContainer\" | \"contentPadding\" | \"maxWidth\"\n> & {\n /* Tooltip content */\n content: React.ReactElement;\n \"data-e2e-test-id\"?: string;\n /* Called when tooltip appears and disappears */\n onVisibilityChange?: (isVisible: boolean) => void;\n};\n\nexport type BaseTooltipProps = BaseProps & TooltipConditionalProps;\n\nconst SHOW_HIDE_DELAY = 200;\n\nexport function BaseTooltip({\n placement = \"auto\",\n content,\n children,\n externalTriggerRef,\n portalContainer,\n contentPadding = \"m\",\n maxWidth,\n \"data-e2e-test-id\": dataE2eTestId,\n onVisibilityChange,\n}: BaseTooltipProps): React.ReactElement {\n const tooltipId = useMemo(\n () => `DSTooltip_${Math.floor(Date.now() * Math.random())}`,\n []\n );\n const [isVisible, setVisible] = useState(false);\n const triggeredByEvent = useRef(null); // indicates if triggered by hover or focus\n const isTooltipHovered = useRef(false);\n const isTriggerHovered = useRef(false);\n const hideTooltipTimeoutId = useRef(null);\n const showTooltipTimeoutId = useRef(null);\n const internalTriggerRef = useRef(null);\n const triggerRef = externalTriggerRef || internalTriggerRef;\n\n const toggleVisibility = useCallback(\n (status: boolean) => {\n setVisible(status);\n\n if (onVisibilityChange) {\n onVisibilityChange(status);\n }\n },\n [onVisibilityChange]\n );\n\n const handleTriggerPointerEnter = useCallback(() => {\n isTriggerHovered.current = true;\n if (!isTooltipHovered.current) {\n clearTimeout(showTooltipTimeoutId.current);\n // Delay show tooltip to prevent flickering when mouse moves quickly over trigger\n showTooltipTimeoutId.current = setTimeout(() => {\n if (isTriggerHovered.current) {\n triggeredByEvent.current = \"hover\";\n toggleVisibility(true);\n }\n }, SHOW_HIDE_DELAY);\n }\n }, [toggleVisibility]);\n\n const handleTriggerPointerLeave = useCallback(() => {\n isTriggerHovered.current = false;\n clearTimeout(hideTooltipTimeoutId.current);\n // Delay removing tooltip from DOM to allow hover over tooltip element\n hideTooltipTimeoutId.current = setTimeout(() => {\n if (\n !isTooltipHovered.current &&\n triggeredByEvent.current === \"hover\" &&\n !isTriggerHovered.current\n ) {\n toggleVisibility(false);\n }\n }, SHOW_HIDE_DELAY);\n }, [toggleVisibility]);\n\n const handleTriggerFocus = useCallback(() => {\n triggeredByEvent.current = \"focus\";\n toggleVisibility(true);\n }, [toggleVisibility]);\n\n const handleTriggerBlur = useCallback(() => {\n if (triggeredByEvent.current === \"focus\") {\n toggleVisibility(false);\n }\n }, [toggleVisibility]);\n\n const handleTriggerKeyDown = useCallback(\n (evt) => {\n if (evt.key === \"Escape\") {\n toggleVisibility(false);\n }\n },\n [toggleVisibility]\n );\n\n const handleTooltipPointerEnter = () => {\n isTooltipHovered.current = true;\n };\n\n const handleTooltipPointerLeave = () => {\n isTooltipHovered.current = false;\n if (triggeredByEvent.current === \"hover\") {\n toggleVisibility(false);\n }\n };\n\n useEffect(\n () => () => {\n // clear timers\n clearTimeout(showTooltipTimeoutId.current);\n clearTimeout(hideTooltipTimeoutId.current);\n },\n []\n );\n\n useEffect(() => {\n let trigger: HTMLElement;\n\n if (externalTriggerRef?.current && !children) {\n trigger = externalTriggerRef.current;\n\n trigger.setAttribute(\"tabindex\", \"0\");\n trigger.addEventListener(\"pointerenter\", handleTriggerPointerEnter);\n trigger.addEventListener(\"pointerleave\", handleTriggerPointerLeave);\n trigger.addEventListener(\"focus\", handleTriggerFocus);\n trigger.addEventListener(\"blur\", handleTriggerBlur);\n trigger.addEventListener(\"keydown\", handleTriggerKeyDown);\n }\n\n return () => {\n if (trigger) {\n trigger.removeEventListener(\"pointerenter\", handleTriggerPointerEnter);\n trigger.removeEventListener(\"pointerleave\", handleTriggerPointerLeave);\n trigger.removeEventListener(\"focus\", handleTriggerFocus);\n trigger.removeEventListener(\"blur\", handleTriggerBlur);\n trigger.removeEventListener(\"keydown\", handleTriggerKeyDown);\n }\n };\n }, [\n externalTriggerRef,\n children,\n handleTriggerPointerEnter,\n handleTriggerPointerLeave,\n handleTriggerFocus,\n handleTriggerBlur,\n handleTriggerKeyDown,\n ]);\n\n useEffect(() => {\n if (externalTriggerRef?.current && !children) {\n const trigger = externalTriggerRef.current;\n\n if (isVisible) {\n trigger.setAttribute(\"aria-describedby\", tooltipId);\n } else {\n trigger.removeAttribute(\"aria-describedby\");\n }\n }\n }, [externalTriggerRef, children, tooltipId, isVisible]);\n\n const triggerElm = children\n ? React.cloneElement(children, {\n ref: triggerRef,\n ...(isVisible && {\n \"aria-describedby\": tooltipId,\n }),\n tabIndex: 0,\n onPointerEnter: handleTriggerPointerEnter,\n onPointerLeave: handleTriggerPointerLeave,\n onFocus: (evt: FocusEvent) => {\n handleTriggerFocus();\n if (children.props.onFocus) {\n children.props.onFocus(evt);\n }\n },\n onBlur: (evt: FocusEvent) => {\n handleTriggerBlur();\n if (children.props.onBlur) {\n if (children.props.onBlur) {\n children.props.onBlur(evt);\n }\n }\n },\n onKeyDown: handleTriggerKeyDown,\n })\n : null;\n\n const tooltipElm = (\n <TooltipContent\n dataDSId=\"Tooltip\"\n content={content}\n placement={placement}\n portalContainer={portalContainer}\n dataE2eTestId={dataE2eTestId}\n isVisible={isVisible}\n tooltipId={tooltipId}\n triggerRef={triggerRef}\n aria-hidden\n role=\"tooltip\"\n contentPadding={contentPadding}\n maxWidth={maxWidth}\n onTooltipPointerEnter={handleTooltipPointerEnter}\n onTooltipPointerLeave={handleTooltipPointerLeave}\n />\n );\n return (\n <>\n {triggerElm}\n {tooltipElm}\n </>\n );\n}\n"],"names":["SHOW_HIDE_DELAY","BaseTooltip","_ref","placement","content","children","externalTriggerRef","portalContainer","contentPadding","maxWidth","dataE2eTestId","onVisibilityChange","tooltipId","useMemo","Math","floor","Date","now","random","isVisible","setVisible","useState","triggeredByEvent","useRef","isTooltipHovered","isTriggerHovered","hideTooltipTimeoutId","showTooltipTimeoutId","internalTriggerRef","triggerRef","toggleVisibility","useCallback","status","handleTriggerPointerEnter","current","clearTimeout","setTimeout","handleTriggerPointerLeave","handleTriggerFocus","handleTriggerBlur","handleTriggerKeyDown","evt","key","handleTooltipPointerEnter","handleTooltipPointerLeave","useEffect","trigger","setAttribute","addEventListener","removeEventListener","removeAttribute","triggerElm","React","cloneElement","ref","tabIndex","onPointerEnter","onPointerLeave","onFocus","props","onBlur","onKeyDown","tooltipElm","createElement","TooltipContent","dataDSId","role","onTooltipPointerEnter","onTooltipPointerLeave","Fragment"],"mappings":"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"}
|
|
@@ -1,17 +1,7 @@
|
|
|
1
|
-
import React
|
|
2
|
-
import type {
|
|
3
|
-
|
|
1
|
+
import React from "react";
|
|
2
|
+
import type { BaseTooltipProps } from "./BaseTooltip";
|
|
3
|
+
import { TooltipConditionalProps } from "./types";
|
|
4
|
+
export type TooltipProps = Omit<BaseTooltipProps, "content" | "contentPadding" | "maxWidth"> & {
|
|
4
5
|
content: string;
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
};
|
|
8
|
-
type ConditionalProps = {
|
|
9
|
-
externalTriggerRef?: never;
|
|
10
|
-
children: React.ReactElement;
|
|
11
|
-
} | {
|
|
12
|
-
children?: never;
|
|
13
|
-
externalTriggerRef: MutableRefObject<any>;
|
|
14
|
-
};
|
|
15
|
-
export type TooltipProps = BaseProps & ConditionalProps;
|
|
16
|
-
export declare function Tooltip({ placement, content, children, externalTriggerRef, portalContainer, "data-e2e-test-id": dataE2eTestId, onVisibilityChange, }: TooltipProps): React.ReactElement;
|
|
17
|
-
export {};
|
|
6
|
+
} & TooltipConditionalProps;
|
|
7
|
+
export declare function Tooltip({ content, ...rest }: TooltipProps): React.ReactElement;
|