@snack-uikit/modal 0.9.2 → 0.9.3-preview-76eafcdd.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.
Files changed (5) hide show
  1. package/dist/components/Modal/Modal.js +1 -1
  2. package/dist/helperComponents/Header/Header.js +1 -1
  3. package/package.json +2 -2
  4. package/src/components/Modal/Modal.tsx +1 -1
  5. package/src/helperComponents/Header/Header.tsx +17 -13
package/dist/components/Modal/Modal.js CHANGED
@@ -23,5 +23,5 @@ export function Modal(_a) {
23
23
  const aligns = getAlignProps({ align, size });
24
24
  const buttonsSize = getButtonsSize({ align, size });
25
25
  const picture = getPicture({ size, picture: pictureProp });
26
- return (_jsxs(ModalCustom, Object.assign({ open: open, onClose: onClose, size: size, mode: mode, className: className }, rest, { children: [_jsx(ModalCustom.Header, { title: _jsx(TruncateString, { text: title }), titleTooltip: titleTooltip, subtitle: subtitle, picture: picture, align: aligns.header }), Boolean(content) && _jsx(ModalCustom.Body, { content: content, align: aligns.body }), _jsx(ModalCustom.Footer, { actions: _jsxs(_Fragment, { children: [_jsx(ButtonFilled, Object.assign({}, approveButton, { size: buttonsSize, className: styles.footerButton, "data-test-id": TEST_IDS.approveButton })), cancelButton && (_jsx(ButtonOutline, Object.assign({}, cancelButton, { size: buttonsSize, className: styles.footerButton, "data-test-id": TEST_IDS.cancelButton }))), additionalButton && (_jsx(ButtonSimple, Object.assign({}, additionalButton, { size: buttonsSize, className: styles.footerButton, "data-test-id": TEST_IDS.additionalButton })))] }), disclaimer: disclaimer && (_jsxs(_Fragment, { children: [_jsx(Typography.SansBodyS, { "data-test-id": TEST_IDS.disclaimerText, children: disclaimer.text }), disclaimer.link && (_jsx(Link, Object.assign({}, disclaimer.link, { size: 's', external: true, "data-test-id": TEST_IDS.disclaimerLink })))] })), align: aligns.footer, className: styles.modalFooter })] })));
26
+ return (_jsxs(ModalCustom, Object.assign({ open: open, onClose: onClose, size: size, mode: mode, className: className }, rest, { children: [_jsx(ModalCustom.Header, { title: title ? _jsx(TruncateString, { text: title }) : '', titleTooltip: titleTooltip, subtitle: subtitle, picture: picture, align: aligns.header }), Boolean(content) && _jsx(ModalCustom.Body, { content: content, align: aligns.body }), _jsx(ModalCustom.Footer, { actions: _jsxs(_Fragment, { children: [_jsx(ButtonFilled, Object.assign({}, approveButton, { size: buttonsSize, className: styles.footerButton, "data-test-id": TEST_IDS.approveButton })), cancelButton && (_jsx(ButtonOutline, Object.assign({}, cancelButton, { size: buttonsSize, className: styles.footerButton, "data-test-id": TEST_IDS.cancelButton }))), additionalButton && (_jsx(ButtonSimple, Object.assign({}, additionalButton, { size: buttonsSize, className: styles.footerButton, "data-test-id": TEST_IDS.additionalButton })))] }), disclaimer: disclaimer && (_jsxs(_Fragment, { children: [_jsx(Typography.SansBodyS, { "data-test-id": TEST_IDS.disclaimerText, children: disclaimer.text }), disclaimer.link && (_jsx(Link, Object.assign({}, disclaimer.link, { size: 's', external: true, "data-test-id": TEST_IDS.disclaimerLink })))] })), align: aligns.footer, className: styles.modalFooter })] })));
27
27
  }
package/dist/helperComponents/Header/Header.js CHANGED
@@ -21,5 +21,5 @@ import styles from './styles.module.css';
21
21
  export function ModalHeader(_a) {
22
22
  var { title, titleTooltip, subtitle, align = CONTENT_ALIGN.Default, picture, className } = _a, rest = __rest(_a, ["title", "titleTooltip", "subtitle", "align", "picture", "className"]);
23
23
  return (_jsxs("div", Object.assign({ className: cn(styles.header, className) }, extractSupportProps(rest), { "data-test-id": TEST_IDS.header, children: [picture &&
24
- (isPictureImage(picture) ? (_jsx("img", { src: picture.src, alt: picture.alt, className: styles.image, "data-test-id": TEST_IDS.image })) : (_jsx("div", { className: styles.icon, "data-test-id": TEST_IDS.icon, children: _jsx(IconPredefined, { icon: picture, size: 'l' }) }))), _jsxs("div", { className: styles.headlineLayout, "data-align": align, children: [_jsxs("div", { className: styles.headline, children: [_jsx(Typography.SansHeadlineS, { className: styles.title, "data-test-id": TEST_IDS.title, children: title }), titleTooltip && _jsx(QuestionTooltip, { tip: titleTooltip, size: 's', "data-test-id": TEST_IDS.tooltip })] }), subtitle && (_jsx(Typography.SansBodyM, { className: styles.subtitle, "data-test-id": TEST_IDS.subtitle, children: subtitle }))] })] })));
24
+ (isPictureImage(picture) ? (_jsx("img", { src: picture.src, alt: picture.alt, className: styles.image, "data-test-id": TEST_IDS.image })) : (_jsx("div", { className: styles.icon, "data-test-id": TEST_IDS.icon, children: _jsx(IconPredefined, { icon: picture, size: 'l' }) }))), (title || subtitle) && (_jsxs("div", { className: styles.headlineLayout, "data-align": align, children: [title && (_jsxs("div", { className: styles.headline, children: [_jsx(Typography.SansHeadlineS, { className: styles.title, "data-test-id": TEST_IDS.title, children: title }), titleTooltip && _jsx(QuestionTooltip, { tip: titleTooltip, size: 's', "data-test-id": TEST_IDS.tooltip })] })), subtitle && (_jsx(Typography.SansBodyM, { className: styles.subtitle, "data-test-id": TEST_IDS.subtitle, children: subtitle }))] }))] })));
25
25
  }
package/package.json CHANGED
@@ -4,7 +4,7 @@
4
4
  "access": "public"
5
5
  },
6
6
  "title": "Modal",
7
- "version": "0.9.2",
7
+ "version": "0.9.3-preview-76eafcdd.0",
8
8
  "sideEffects": [
9
9
  "*.css",
10
10
  "*.woff",
@@ -47,5 +47,5 @@
47
47
  "devDependencies": {
48
48
  "@types/react-modal": "3.16.0"
49
49
  },
50
- "gitHead": "50ef9bb113ec40897ffb3eeae62539ce82ade899"
50
+ "gitHead": "1d0cb4f6070447dbf1ed9455fa3df8b9cd617e92"
51
51
  }
package/src/components/Modal/Modal.tsx CHANGED
@@ -36,7 +36,7 @@ export function Modal({
36
36
  return (
37
37
  <ModalCustom open={open} onClose={onClose} size={size} mode={mode} className={className} {...rest}>
38
38
  <ModalCustom.Header
39
- title={<TruncateString text={title} />}
39
+ title={title ? <TruncateString text={title} /> : ''}
40
40
  titleTooltip={titleTooltip}
41
41
  subtitle={subtitle}
42
42
  picture={picture}
package/src/helperComponents/Header/Header.tsx CHANGED
@@ -46,21 +46,25 @@ export function ModalHeader({
46
46
  </div>
47
47
  ))}
48
48
 
49
- <div className={styles.headlineLayout} data-align={align}>
50
- <div className={styles.headline}>
51
- <Typography.SansHeadlineS className={styles.title} data-test-id={TEST_IDS.title}>
52
- {title}
53
- </Typography.SansHeadlineS>
49
+ {(title || subtitle) && (
50
+ <div className={styles.headlineLayout} data-align={align}>
51
+ {title && (
52
+ <div className={styles.headline}>
53
+ <Typography.SansHeadlineS className={styles.title} data-test-id={TEST_IDS.title}>
54
+ {title}
55
+ </Typography.SansHeadlineS>
54
56
 
55
- {titleTooltip && <QuestionTooltip tip={titleTooltip} size='s' data-test-id={TEST_IDS.tooltip} />}
56
- </div>
57
+ {titleTooltip && <QuestionTooltip tip={titleTooltip} size='s' data-test-id={TEST_IDS.tooltip} />}
58
+ </div>
59
+ )}
57
60
 
58
- {subtitle && (
59
- <Typography.SansBodyM className={styles.subtitle} data-test-id={TEST_IDS.subtitle}>
60
- {subtitle}
61
- </Typography.SansBodyM>
62
- )}
63
- </div>
61
+ {subtitle && (
62
+ <Typography.SansBodyM className={styles.subtitle} data-test-id={TEST_IDS.subtitle}>
63
+ {subtitle}
64
+ </Typography.SansBodyM>
65
+ )}
66
+ </div>
67
+ )}
64
68
  </div>
65
69
  );
66
70
  }