@coveord/plasma-mantine 48.17.1 → 48.17.3
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/.turbo/turbo-build.log +3 -3
- package/.turbo/turbo-test.log +7 -7
- package/dist/.tsbuildinfo +1 -1
- package/dist/cjs/components/header/Header.js +1 -0
- package/dist/cjs/components/header/Header.js.map +1 -1
- package/dist/cjs/components/sticky-footer/StickyFooter.js +13 -11
- package/dist/cjs/components/sticky-footer/StickyFooter.js.map +1 -1
- package/dist/definitions/components/sticky-footer/StickyFooter.d.ts.map +1 -1
- package/dist/esm/components/header/Header.js +1 -0
- package/dist/esm/components/header/Header.js.map +1 -1
- package/dist/esm/components/sticky-footer/StickyFooter.js +15 -13
- package/dist/esm/components/sticky-footer/StickyFooter.js.map +1 -1
- package/package.json +1 -1
- package/src/components/header/Header.tsx +1 -1
- package/src/components/sticky-footer/StickyFooter.tsx +9 -7
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/header/Header.tsx"],"sourcesContent":["import {QuestionSize24Px} from '@coveord/plasma-react-icons';\nimport {Anchor, Breadcrumbs, DefaultProps, Divider, Group, Stack, Text, Title, Tooltip} from '@mantine/core';\nimport {FunctionComponent, ReactNode} from 'react';\n\nexport interface HeaderProps extends DefaultProps {\n /**\n * The description text displayed inside the header underneath the title\n */\n description?: ReactNode;\n /**\n * Action buttons that can be displayed on the right of the header\n */\n actions?: ReactNode;\n /**\n * Whether the header should have a border on the bottom\n */\n borderBottom?: boolean;\n /**\n * A href pointing to documentation related to the current panel.\n * When provided, an info icon is rendered next to the title as link to this documentation\n */\n docLink?: string;\n /**\n * The tooltip text shown when hovering over the doc link icon\n */\n docLinkTooltipLabel?: string;\n /**\n * The title of the header.\n * If more than one children are provided, each of them act as parts of a breadcrumb\n */\n children: ReactNode;\n}\n\nexport const Header: FunctionComponent<HeaderProps> = ({\n description,\n actions,\n borderBottom,\n docLink,\n docLinkTooltipLabel,\n children,\n ...others\n}) => (\n <>\n <Group position=\"apart\" py=\"md\" px=\"xl\" {...others}>\n <Stack spacing=\"xs\">\n <Title order={4}>\n <Group spacing={0}>\n <Breadcrumbs>{children}</Breadcrumbs>\n {docLink ? (\n <Tooltip label={docLinkTooltipLabel} position=\"bottom\">\n <Anchor href={docLink} target=\"_blank\" ml=\"xs\">\n <QuestionSize24Px height={24} />\n </Anchor>\n </Tooltip>\n ) : null}\n </Group>\n </Title>\n <Text size=\"sm\">{description}</Text>\n </Stack>\n <Group spacing=\"xs\">{actions}</Group>\n </Group>\n {borderBottom ? <Divider size=\"xs\" /> : null}\n </>\n);\n"],"names":["Header","description","actions","borderBottom","docLink","docLinkTooltipLabel","children","others","Group","position","py","px","Stack","spacing","Title","order","Breadcrumbs","Tooltip","label","Anchor","href","target","ml","QuestionSize24Px","height","Text","size","Divider"],"mappings":"AAAA;;;;+BAiCaA;;;eAAAA;;;;;;;gCAjCkB;oBAC8D;AAgCtF,IAAMA,SAAyC,+BASlD;QARAC,qBAAAA,aACAC,iBAAAA,SACAC,sBAAAA,cACAC,iBAAAA,SACAC,6BAAAA,qBACAC,kBAAAA,UACGC;QANHN;QACAC;QACAC;QACAC;QACAC;QACAC;;WAGA;;0BACI,sBAACE,WAAK;gBAACC,UAAS;gBAAQC,IAAG;gBAAKC,IAAG;eAASJ;;kCACxC,sBAACK,WAAK;wBAACC,SAAQ;;0CACX,qBAACC,WAAK;gCAACC,OAAO;0CACV,cAAA,sBAACP,WAAK;oCAACK,SAAS;;sDACZ,qBAACG,iBAAW;sDAAEV;;wCACbF,wBACG,qBAACa,aAAO;4CAACC,OAAOb;4CAAqBI,UAAS;sDAC1C,cAAA,qBAACU,YAAM;gDAACC,
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/header/Header.tsx"],"sourcesContent":["import {QuestionSize24Px} from '@coveord/plasma-react-icons';\nimport {Anchor, Breadcrumbs, DefaultProps, Divider, Group, Stack, Text, Title, Tooltip} from '@mantine/core';\nimport {FunctionComponent, ReactNode} from 'react';\n\nexport interface HeaderProps extends DefaultProps {\n /**\n * The description text displayed inside the header underneath the title\n */\n description?: ReactNode;\n /**\n * Action buttons that can be displayed on the right of the header\n */\n actions?: ReactNode;\n /**\n * Whether the header should have a border on the bottom\n */\n borderBottom?: boolean;\n /**\n * A href pointing to documentation related to the current panel.\n * When provided, an info icon is rendered next to the title as link to this documentation\n */\n docLink?: string;\n /**\n * The tooltip text shown when hovering over the doc link icon\n */\n docLinkTooltipLabel?: string;\n /**\n * The title of the header.\n * If more than one children are provided, each of them act as parts of a breadcrumb\n */\n children: ReactNode;\n}\n\nexport const Header: FunctionComponent<HeaderProps> = ({\n description,\n actions,\n borderBottom,\n docLink,\n docLinkTooltipLabel,\n children,\n ...others\n}) => (\n <>\n <Group position=\"apart\" py=\"md\" px=\"xl\" {...others}>\n <Stack spacing=\"xs\">\n <Title order={4}>\n <Group spacing={0}>\n <Breadcrumbs>{children}</Breadcrumbs>\n {docLink ? (\n <Tooltip label={docLinkTooltipLabel} position=\"bottom\">\n <Anchor inline href={docLink} target=\"_blank\" ml=\"xs\">\n <QuestionSize24Px height={24} />\n </Anchor>\n </Tooltip>\n ) : null}\n </Group>\n </Title>\n <Text size=\"sm\">{description}</Text>\n </Stack>\n <Group spacing=\"xs\">{actions}</Group>\n </Group>\n {borderBottom ? <Divider size=\"xs\" /> : null}\n </>\n);\n"],"names":["Header","description","actions","borderBottom","docLink","docLinkTooltipLabel","children","others","Group","position","py","px","Stack","spacing","Title","order","Breadcrumbs","Tooltip","label","Anchor","inline","href","target","ml","QuestionSize24Px","height","Text","size","Divider"],"mappings":"AAAA;;;;+BAiCaA;;;eAAAA;;;;;;;gCAjCkB;oBAC8D;AAgCtF,IAAMA,SAAyC,+BASlD;QARAC,qBAAAA,aACAC,iBAAAA,SACAC,sBAAAA,cACAC,iBAAAA,SACAC,6BAAAA,qBACAC,kBAAAA,UACGC;QANHN;QACAC;QACAC;QACAC;QACAC;QACAC;;WAGA;;0BACI,sBAACE,WAAK;gBAACC,UAAS;gBAAQC,IAAG;gBAAKC,IAAG;eAASJ;;kCACxC,sBAACK,WAAK;wBAACC,SAAQ;;0CACX,qBAACC,WAAK;gCAACC,OAAO;0CACV,cAAA,sBAACP,WAAK;oCAACK,SAAS;;sDACZ,qBAACG,iBAAW;sDAAEV;;wCACbF,wBACG,qBAACa,aAAO;4CAACC,OAAOb;4CAAqBI,UAAS;sDAC1C,cAAA,qBAACU,YAAM;gDAACC,MAAM;gDAACC,MAAMjB;gDAASkB,QAAO;gDAASC,IAAG;0DAC7C,cAAA,qBAACC,kCAAgB;oDAACC,QAAQ;;;6CAGlC,IAAI;;;;0CAGhB,qBAACC,UAAI;gCAACC,MAAK;0CAAM1B;;;;kCAErB,qBAACO,WAAK;wBAACK,SAAQ;kCAAMX;;;;YAExBC,6BAAe,qBAACyB,aAAO;gBAACD,MAAK;iBAAU,IAAI;;;AAC9C"}
|
|
@@ -19,7 +19,7 @@ var useStyles = (0, _core.createStyles)(function() {
|
|
|
19
19
|
position: "sticky",
|
|
20
20
|
bottom: 0,
|
|
21
21
|
zIndex: 1,
|
|
22
|
-
|
|
22
|
+
backgroundColor: "white"
|
|
23
23
|
}
|
|
24
24
|
};
|
|
25
25
|
});
|
|
@@ -29,20 +29,22 @@ var StickyFooter = function(_param) {
|
|
|
29
29
|
"children"
|
|
30
30
|
]);
|
|
31
31
|
var classes = useStyles().classes;
|
|
32
|
-
return /*#__PURE__*/ (0, _jsxRuntime.jsxs)(
|
|
33
|
-
className: classes.footer,
|
|
32
|
+
return /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
|
|
34
33
|
children: [
|
|
35
34
|
borderTop ? /*#__PURE__*/ (0, _jsxRuntime.jsx)(_core.Divider, {
|
|
36
35
|
size: "xs"
|
|
37
36
|
}) : null,
|
|
38
|
-
/*#__PURE__*/ (0, _jsxRuntime.jsx)(_core.
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
37
|
+
/*#__PURE__*/ (0, _jsxRuntime.jsx)(_core.Box, {
|
|
38
|
+
className: classes.footer,
|
|
39
|
+
children: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_core.Group, _objectSpreadProps(_objectSpread({
|
|
40
|
+
position: "right",
|
|
41
|
+
spacing: "xs",
|
|
42
|
+
py: "md",
|
|
43
|
+
px: "xl"
|
|
44
|
+
}, others), {
|
|
45
|
+
children: children
|
|
46
|
+
}))
|
|
47
|
+
})
|
|
46
48
|
]
|
|
47
49
|
});
|
|
48
50
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/sticky-footer/StickyFooter.tsx"],"sourcesContent":["import {createStyles, DefaultProps, Divider, Group
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/sticky-footer/StickyFooter.tsx"],"sourcesContent":["import {Box, createStyles, DefaultProps, Divider, Group} from '@mantine/core';\nimport {FunctionComponent, PropsWithChildren} from 'react';\n\nexport interface StickyFooterProps extends DefaultProps {\n /**\n * Whether a border is render on top of the footer\n */\n borderTop?: boolean;\n}\n\nconst useStyles = createStyles(() => ({\n footer: {\n position: 'sticky',\n bottom: 0,\n zIndex: 1,\n backgroundColor: 'white',\n },\n}));\n\nexport const StickyFooter: FunctionComponent<PropsWithChildren<StickyFooterProps>> = ({\n borderTop,\n children,\n ...others\n}) => {\n const {classes} = useStyles();\n\n return (\n <>\n {borderTop ? <Divider size=\"xs\" /> : null}\n <Box className={classes.footer}>\n <Group position=\"right\" spacing=\"xs\" py=\"md\" px=\"xl\" {...others}>\n {children}\n </Group>\n </Box>\n </>\n );\n};\n"],"names":["StickyFooter","useStyles","createStyles","footer","position","bottom","zIndex","backgroundColor","borderTop","children","others","classes","Divider","size","Box","className","Group","spacing","py","px"],"mappings":"AAAA;;;;+BAmBaA;;;eAAAA;;;;;;;oBAnBiD;AAU9D,IAAMC,YAAYC,IAAAA,kBAAY,EAAC;WAAO;QAClCC,QAAQ;YACJC,UAAU;YACVC,QAAQ;YACRC,QAAQ;YACRC,iBAAiB;QACrB;IACJ;;AAEO,IAAMP,eAAwE,iBAI/E;QAHFQ,mBAAAA,WACAC,kBAAAA,UACGC;QAFHF;QACAC;;IAGA,IAAM,AAACE,UAAWV,YAAXU;IAEP,qBACI;;YACKH,0BAAY,qBAACI,aAAO;gBAACC,MAAK;iBAAU,IAAI;0BACzC,qBAACC,SAAG;gBAACC,WAAWJ,QAAQR,MAAM;0BAC1B,cAAA,qBAACa,WAAK;oBAACZ,UAAS;oBAAQa,SAAQ;oBAAKC,IAAG;oBAAKC,IAAG;mBAAST;8BACpDD;;;;;AAKrB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StickyFooter.d.ts","sourceRoot":"","sources":["../../../../src/components/sticky-footer/StickyFooter.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"StickyFooter.d.ts","sourceRoot":"","sources":["../../../../src/components/sticky-footer/StickyFooter.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAoB,YAAY,EAAiB,MAAM,eAAe,CAAC;AAC9E,OAAO,EAAC,iBAAiB,EAAE,iBAAiB,EAAC,MAAM,OAAO,CAAC;AAE3D,MAAM,WAAW,iBAAkB,SAAQ,YAAY;IACnD;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACvB;AAWD,eAAO,MAAM,YAAY,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAiBhF,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/header/Header.tsx"],"sourcesContent":["import {QuestionSize24Px} from '@coveord/plasma-react-icons';\nimport {Anchor, Breadcrumbs, DefaultProps, Divider, Group, Stack, Text, Title, Tooltip} from '@mantine/core';\nimport {FunctionComponent, ReactNode} from 'react';\n\nexport interface HeaderProps extends DefaultProps {\n /**\n * The description text displayed inside the header underneath the title\n */\n description?: ReactNode;\n /**\n * Action buttons that can be displayed on the right of the header\n */\n actions?: ReactNode;\n /**\n * Whether the header should have a border on the bottom\n */\n borderBottom?: boolean;\n /**\n * A href pointing to documentation related to the current panel.\n * When provided, an info icon is rendered next to the title as link to this documentation\n */\n docLink?: string;\n /**\n * The tooltip text shown when hovering over the doc link icon\n */\n docLinkTooltipLabel?: string;\n /**\n * The title of the header.\n * If more than one children are provided, each of them act as parts of a breadcrumb\n */\n children: ReactNode;\n}\n\nexport const Header: FunctionComponent<HeaderProps> = ({\n description,\n actions,\n borderBottom,\n docLink,\n docLinkTooltipLabel,\n children,\n ...others\n}) => (\n <>\n <Group position=\"apart\" py=\"md\" px=\"xl\" {...others}>\n <Stack spacing=\"xs\">\n <Title order={4}>\n <Group spacing={0}>\n <Breadcrumbs>{children}</Breadcrumbs>\n {docLink ? (\n <Tooltip label={docLinkTooltipLabel} position=\"bottom\">\n <Anchor href={docLink} target=\"_blank\" ml=\"xs\">\n <QuestionSize24Px height={24} />\n </Anchor>\n </Tooltip>\n ) : null}\n </Group>\n </Title>\n <Text size=\"sm\">{description}</Text>\n </Stack>\n <Group spacing=\"xs\">{actions}</Group>\n </Group>\n {borderBottom ? <Divider size=\"xs\" /> : null}\n </>\n);\n"],"names":["QuestionSize24Px","Anchor","Breadcrumbs","Divider","Group","Stack","Text","Title","Tooltip","Header","description","actions","borderBottom","docLink","docLinkTooltipLabel","children","others","position","py","px","spacing","order","label","href","target","ml","height","size"],"mappings":"AAAA;;;;AAAA,SAAQA,gBAAgB,QAAO,8BAA8B;AAC7D,SAAQC,MAAM,EAAEC,WAAW,EAAgBC,OAAO,EAAEC,KAAK,EAAEC,KAAK,EAAEC,IAAI,EAAEC,KAAK,EAAEC,OAAO,QAAO,gBAAgB;AAgC7G,OAAO,IAAMC,SAAyC,+BASlD;QARAC,qBAAAA,aACAC,iBAAAA,SACAC,sBAAAA,cACAC,iBAAAA,SACAC,6BAAAA,qBACAC,kBAAAA,UACGC;QANHN;QACAC;QACAC;QACAC;QACAC;QACAC;;WAGA;;0BACI,MAACX;gBAAMa,UAAS;gBAAQC,IAAG;gBAAKC,IAAG;eAASH;;kCACxC,MAACX;wBAAMe,SAAQ;;0CACX,KAACb;gCAAMc,OAAO;0CACV,cAAA,MAACjB;oCAAMgB,SAAS;;sDACZ,KAAClB;sDAAaa;;wCACbF,wBACG,KAACL;4CAAQc,OAAOR;4CAAqBG,UAAS;sDAC1C,cAAA,KAAChB;gDAAOsB,
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/header/Header.tsx"],"sourcesContent":["import {QuestionSize24Px} from '@coveord/plasma-react-icons';\nimport {Anchor, Breadcrumbs, DefaultProps, Divider, Group, Stack, Text, Title, Tooltip} from '@mantine/core';\nimport {FunctionComponent, ReactNode} from 'react';\n\nexport interface HeaderProps extends DefaultProps {\n /**\n * The description text displayed inside the header underneath the title\n */\n description?: ReactNode;\n /**\n * Action buttons that can be displayed on the right of the header\n */\n actions?: ReactNode;\n /**\n * Whether the header should have a border on the bottom\n */\n borderBottom?: boolean;\n /**\n * A href pointing to documentation related to the current panel.\n * When provided, an info icon is rendered next to the title as link to this documentation\n */\n docLink?: string;\n /**\n * The tooltip text shown when hovering over the doc link icon\n */\n docLinkTooltipLabel?: string;\n /**\n * The title of the header.\n * If more than one children are provided, each of them act as parts of a breadcrumb\n */\n children: ReactNode;\n}\n\nexport const Header: FunctionComponent<HeaderProps> = ({\n description,\n actions,\n borderBottom,\n docLink,\n docLinkTooltipLabel,\n children,\n ...others\n}) => (\n <>\n <Group position=\"apart\" py=\"md\" px=\"xl\" {...others}>\n <Stack spacing=\"xs\">\n <Title order={4}>\n <Group spacing={0}>\n <Breadcrumbs>{children}</Breadcrumbs>\n {docLink ? (\n <Tooltip label={docLinkTooltipLabel} position=\"bottom\">\n <Anchor inline href={docLink} target=\"_blank\" ml=\"xs\">\n <QuestionSize24Px height={24} />\n </Anchor>\n </Tooltip>\n ) : null}\n </Group>\n </Title>\n <Text size=\"sm\">{description}</Text>\n </Stack>\n <Group spacing=\"xs\">{actions}</Group>\n </Group>\n {borderBottom ? <Divider size=\"xs\" /> : null}\n </>\n);\n"],"names":["QuestionSize24Px","Anchor","Breadcrumbs","Divider","Group","Stack","Text","Title","Tooltip","Header","description","actions","borderBottom","docLink","docLinkTooltipLabel","children","others","position","py","px","spacing","order","label","inline","href","target","ml","height","size"],"mappings":"AAAA;;;;AAAA,SAAQA,gBAAgB,QAAO,8BAA8B;AAC7D,SAAQC,MAAM,EAAEC,WAAW,EAAgBC,OAAO,EAAEC,KAAK,EAAEC,KAAK,EAAEC,IAAI,EAAEC,KAAK,EAAEC,OAAO,QAAO,gBAAgB;AAgC7G,OAAO,IAAMC,SAAyC,+BASlD;QARAC,qBAAAA,aACAC,iBAAAA,SACAC,sBAAAA,cACAC,iBAAAA,SACAC,6BAAAA,qBACAC,kBAAAA,UACGC;QANHN;QACAC;QACAC;QACAC;QACAC;QACAC;;WAGA;;0BACI,MAACX;gBAAMa,UAAS;gBAAQC,IAAG;gBAAKC,IAAG;eAASH;;kCACxC,MAACX;wBAAMe,SAAQ;;0CACX,KAACb;gCAAMc,OAAO;0CACV,cAAA,MAACjB;oCAAMgB,SAAS;;sDACZ,KAAClB;sDAAaa;;wCACbF,wBACG,KAACL;4CAAQc,OAAOR;4CAAqBG,UAAS;sDAC1C,cAAA,KAAChB;gDAAOsB,MAAM;gDAACC,MAAMX;gDAASY,QAAO;gDAASC,IAAG;0DAC7C,cAAA,KAAC1B;oDAAiB2B,QAAQ;;;6CAGlC,IAAI;;;;0CAGhB,KAACrB;gCAAKsB,MAAK;0CAAMlB;;;;kCAErB,KAACN;wBAAMgB,SAAQ;kCAAMT;;;;YAExBC,6BAAe,KAACT;gBAAQyB,MAAK;iBAAU,IAAI;;;AAC9C,EACJ"}
|
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
import _object_spread from "@swc/helpers/src/_object_spread.mjs";
|
|
2
2
|
import _object_spread_props from "@swc/helpers/src/_object_spread_props.mjs";
|
|
3
3
|
import _object_without_properties from "@swc/helpers/src/_object_without_properties.mjs";
|
|
4
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
5
|
-
import { createStyles, Divider, Group
|
|
4
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
5
|
+
import { Box, createStyles, Divider, Group } from "@mantine/core";
|
|
6
6
|
var useStyles = createStyles(function() {
|
|
7
7
|
return {
|
|
8
8
|
footer: {
|
|
9
9
|
position: "sticky",
|
|
10
10
|
bottom: 0,
|
|
11
11
|
zIndex: 1,
|
|
12
|
-
|
|
12
|
+
backgroundColor: "white"
|
|
13
13
|
}
|
|
14
14
|
};
|
|
15
15
|
});
|
|
@@ -19,20 +19,22 @@ export var StickyFooter = function(_param) {
|
|
|
19
19
|
"children"
|
|
20
20
|
]);
|
|
21
21
|
var classes = useStyles().classes;
|
|
22
|
-
return /*#__PURE__*/ _jsxs(
|
|
23
|
-
className: classes.footer,
|
|
22
|
+
return /*#__PURE__*/ _jsxs(_Fragment, {
|
|
24
23
|
children: [
|
|
25
24
|
borderTop ? /*#__PURE__*/ _jsx(Divider, {
|
|
26
25
|
size: "xs"
|
|
27
26
|
}) : null,
|
|
28
|
-
/*#__PURE__*/ _jsx(
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
27
|
+
/*#__PURE__*/ _jsx(Box, {
|
|
28
|
+
className: classes.footer,
|
|
29
|
+
children: /*#__PURE__*/ _jsx(Group, _object_spread_props(_object_spread({
|
|
30
|
+
position: "right",
|
|
31
|
+
spacing: "xs",
|
|
32
|
+
py: "md",
|
|
33
|
+
px: "xl"
|
|
34
|
+
}, others), {
|
|
35
|
+
children: children
|
|
36
|
+
}))
|
|
37
|
+
})
|
|
36
38
|
]
|
|
37
39
|
});
|
|
38
40
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/sticky-footer/StickyFooter.tsx"],"sourcesContent":["import {createStyles, DefaultProps, Divider, Group
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/sticky-footer/StickyFooter.tsx"],"sourcesContent":["import {Box, createStyles, DefaultProps, Divider, Group} from '@mantine/core';\nimport {FunctionComponent, PropsWithChildren} from 'react';\n\nexport interface StickyFooterProps extends DefaultProps {\n /**\n * Whether a border is render on top of the footer\n */\n borderTop?: boolean;\n}\n\nconst useStyles = createStyles(() => ({\n footer: {\n position: 'sticky',\n bottom: 0,\n zIndex: 1,\n backgroundColor: 'white',\n },\n}));\n\nexport const StickyFooter: FunctionComponent<PropsWithChildren<StickyFooterProps>> = ({\n borderTop,\n children,\n ...others\n}) => {\n const {classes} = useStyles();\n\n return (\n <>\n {borderTop ? <Divider size=\"xs\" /> : null}\n <Box className={classes.footer}>\n <Group position=\"right\" spacing=\"xs\" py=\"md\" px=\"xl\" {...others}>\n {children}\n </Group>\n </Box>\n </>\n );\n};\n"],"names":["Box","createStyles","Divider","Group","useStyles","footer","position","bottom","zIndex","backgroundColor","StickyFooter","borderTop","children","others","classes","size","className","spacing","py","px"],"mappings":"AAAA;;;;AAAA,SAAQA,GAAG,EAAEC,YAAY,EAAgBC,OAAO,EAAEC,KAAK,QAAO,gBAAgB;AAU9E,IAAMC,YAAYH,aAAa;WAAO;QAClCI,QAAQ;YACJC,UAAU;YACVC,QAAQ;YACRC,QAAQ;YACRC,iBAAiB;QACrB;IACJ;;AAEA,OAAO,IAAMC,eAAwE,iBAI/E;QAHFC,mBAAAA,WACAC,kBAAAA,UACGC;QAFHF;QACAC;;IAGA,IAAM,AAACE,UAAWV,YAAXU;IAEP,qBACI;;YACKH,0BAAY,KAACT;gBAAQa,MAAK;iBAAU,IAAI;0BACzC,KAACf;gBAAIgB,WAAWF,QAAQT,MAAM;0BAC1B,cAAA,KAACF;oBAAMG,UAAS;oBAAQW,SAAQ;oBAAKC,IAAG;oBAAKC,IAAG;mBAASN;8BACpDD;;;;;AAKrB,EAAE"}
|
package/package.json
CHANGED
|
@@ -48,7 +48,7 @@ export const Header: FunctionComponent<HeaderProps> = ({
|
|
|
48
48
|
<Breadcrumbs>{children}</Breadcrumbs>
|
|
49
49
|
{docLink ? (
|
|
50
50
|
<Tooltip label={docLinkTooltipLabel} position="bottom">
|
|
51
|
-
<Anchor href={docLink} target="_blank" ml="xs">
|
|
51
|
+
<Anchor inline href={docLink} target="_blank" ml="xs">
|
|
52
52
|
<QuestionSize24Px height={24} />
|
|
53
53
|
</Anchor>
|
|
54
54
|
</Tooltip>
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {createStyles, DefaultProps, Divider, Group
|
|
1
|
+
import {Box, createStyles, DefaultProps, Divider, Group} from '@mantine/core';
|
|
2
2
|
import {FunctionComponent, PropsWithChildren} from 'react';
|
|
3
3
|
|
|
4
4
|
export interface StickyFooterProps extends DefaultProps {
|
|
@@ -13,7 +13,7 @@ const useStyles = createStyles(() => ({
|
|
|
13
13
|
position: 'sticky',
|
|
14
14
|
bottom: 0,
|
|
15
15
|
zIndex: 1,
|
|
16
|
-
|
|
16
|
+
backgroundColor: 'white',
|
|
17
17
|
},
|
|
18
18
|
}));
|
|
19
19
|
|
|
@@ -25,11 +25,13 @@ export const StickyFooter: FunctionComponent<PropsWithChildren<StickyFooterProps
|
|
|
25
25
|
const {classes} = useStyles();
|
|
26
26
|
|
|
27
27
|
return (
|
|
28
|
-
|
|
28
|
+
<>
|
|
29
29
|
{borderTop ? <Divider size="xs" /> : null}
|
|
30
|
-
<
|
|
31
|
-
{
|
|
32
|
-
|
|
33
|
-
|
|
30
|
+
<Box className={classes.footer}>
|
|
31
|
+
<Group position="right" spacing="xs" py="md" px="xl" {...others}>
|
|
32
|
+
{children}
|
|
33
|
+
</Group>
|
|
34
|
+
</Box>
|
|
35
|
+
</>
|
|
34
36
|
);
|
|
35
37
|
};
|