@telefonica/mistica 10.25.0 → 10.26.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 (6) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/dist/callout.js +37 -26
  3. package/dist/package-version.js +1 -1
  4. package/dist-es/callout.js +38 -27
  5. package/dist-es/package-version.js +1 -1
  6. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,3 +1,10 @@
1
+ # [10.26.0](https://github.com/Telefonica/mistica-web/compare/v10.25.0...v10.26.0) (2022-02-23)
2
+
3
+
4
+ ### Features
5
+
6
+ * **Callout:** Changed element distribution so link has more space ([#414](https://github.com/Telefonica/mistica-web/issues/414)) ([bf3c1cf](https://github.com/Telefonica/mistica-web/commit/bf3c1cfc30db7f5df498743b414599635582910e))
7
+
1
8
  # [10.25.0](https://github.com/Telefonica/mistica-web/compare/v10.24.2...v10.25.0) (2022-02-23)
2
9
 
3
10
 
package/dist/callout.js CHANGED
@@ -6,6 +6,8 @@ exports.default = void 0;
6
6
  var _jsxRuntime = require("react/jsx-runtime");
7
7
  var React = _interopRequireWildcard(require("react"));
8
8
  var _stack = _interopRequireDefault(require("./stack"));
9
+ var _inline = _interopRequireDefault(require("./inline"));
10
+ var _box = _interopRequireDefault(require("./box"));
9
11
  var _hooks = require("./hooks");
10
12
  var _themeVariantContext = require("./theme-variant-context");
11
13
  var _jss = require("./jss");
@@ -94,8 +96,8 @@ var Callout = function Callout(param) {
94
96
  children: /*#__PURE__*/ (0, _jsxRuntime).jsxs(_themeVariantContext.ThemeVariant, {
95
97
  isInverse: false,
96
98
  children: [
97
- icon && /*#__PURE__*/ (0, _jsxRuntime).jsx("div", {
98
- className: classes.icon,
99
+ icon && /*#__PURE__*/ (0, _jsxRuntime).jsx(_box.default, {
100
+ paddingRight: 16,
99
101
  children: icon
100
102
  }),
101
103
  /*#__PURE__*/ (0, _jsxRuntime).jsx("div", {
@@ -103,18 +105,41 @@ var Callout = function Callout(param) {
103
105
  children: /*#__PURE__*/ (0, _jsxRuntime).jsxs(_stack.default, {
104
106
  space: 16,
105
107
  children: [
106
- /*#__PURE__*/ (0, _jsxRuntime).jsxs(_jsxRuntime.Fragment, {
108
+ /*#__PURE__*/ (0, _jsxRuntime).jsxs(_inline.default, {
109
+ fullWidth: true,
110
+ alignItems: "flex-start",
111
+ space: "between",
107
112
  children: [
108
- /*#__PURE__*/ (0, _jsxRuntime).jsx(_text.Text3, {
109
- as: "h2",
110
- regular: true,
111
- children: title
113
+ /*#__PURE__*/ (0, _jsxRuntime).jsxs(_stack.default, {
114
+ space: 4,
115
+ children: [
116
+ /*#__PURE__*/ (0, _jsxRuntime).jsx(_text.Text3, {
117
+ as: "h2",
118
+ regular: true,
119
+ children: title
120
+ }),
121
+ /*#__PURE__*/ (0, _jsxRuntime).jsx(_text.Text2, {
122
+ as: "p",
123
+ regular: true,
124
+ color: colors.textSecondary,
125
+ children: description
126
+ })
127
+ ]
112
128
  }),
113
- /*#__PURE__*/ (0, _jsxRuntime).jsx(_text.Text2, {
114
- as: "p",
115
- regular: true,
116
- color: colors.textSecondary,
117
- children: description
129
+ onClose && /*#__PURE__*/ (0, _jsxRuntime).jsx(_iconButton.default, {
130
+ size: 40,
131
+ style: {
132
+ display: 'flex',
133
+ margin: '-8px -12px',
134
+ alignItems: 'center',
135
+ justifyContent: 'center'
136
+ },
137
+ onPress: onClose,
138
+ "aria-label": texts.closeButtonLabel,
139
+ children: /*#__PURE__*/ (0, _jsxRuntime).jsx(_iconCloseRegular.default, {
140
+ size: 24,
141
+ color: colors.neutralHigh
142
+ })
118
143
  })
119
144
  ]
120
145
  }),
@@ -125,20 +150,6 @@ var Callout = function Callout(param) {
125
150
  })
126
151
  ]
127
152
  })
128
- }),
129
- onClose && /*#__PURE__*/ (0, _jsxRuntime).jsx(_iconButton.default, {
130
- size: 40,
131
- style: {
132
- display: 'flex',
133
- margin: '-8px -12px -8px 0',
134
- alignItems: 'center',
135
- justifyContent: 'center'
136
- },
137
- onPress: onClose,
138
- "aria-label": texts.closeButtonLabel,
139
- children: /*#__PURE__*/ (0, _jsxRuntime).jsx(_iconCloseRegular.default, {
140
- color: colors.neutralHigh
141
- })
142
153
  })
143
154
  ]
144
155
  })
package/dist/package-version.js CHANGED
@@ -3,5 +3,5 @@ Object.defineProperty(exports, "__esModule", {
3
3
  value: true
4
4
  });
5
5
  exports.PACKAGE_VERSION = void 0;
6
- var PACKAGE_VERSION = '10.25.0';
6
+ var PACKAGE_VERSION = '10.26.0';
7
7
  exports.PACKAGE_VERSION = PACKAGE_VERSION;
package/dist-es/callout.js CHANGED
@@ -1,6 +1,8 @@
1
- import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import * as React from 'react';
3
3
  import Stack from './stack';
4
+ import Inline from './inline';
5
+ import Box from './box';
4
6
  import { useTheme } from './hooks';
5
7
  import { ThemeVariant, useIsInverseVariant } from './theme-variant-context';
6
8
  import { createUseStyles } from './jss';
@@ -63,8 +65,8 @@ var Callout = function(param) {
63
65
  children: /*#__PURE__*/ _jsxs(ThemeVariant, {
64
66
  isInverse: false,
65
67
  children: [
66
- icon && /*#__PURE__*/ _jsx("div", {
67
- className: classes.icon,
68
+ icon && /*#__PURE__*/ _jsx(Box, {
69
+ paddingRight: 16,
68
70
  children: icon
69
71
  }),
70
72
  /*#__PURE__*/ _jsx("div", {
@@ -72,18 +74,41 @@ var Callout = function(param) {
72
74
  children: /*#__PURE__*/ _jsxs(Stack, {
73
75
  space: 16,
74
76
  children: [
75
- /*#__PURE__*/ _jsxs(_Fragment, {
77
+ /*#__PURE__*/ _jsxs(Inline, {
78
+ fullWidth: true,
79
+ alignItems: "flex-start",
80
+ space: "between",
76
81
  children: [
77
- /*#__PURE__*/ _jsx(Text3, {
78
- as: "h2",
79
- regular: true,
80
- children: title
82
+ /*#__PURE__*/ _jsxs(Stack, {
83
+ space: 4,
84
+ children: [
85
+ /*#__PURE__*/ _jsx(Text3, {
86
+ as: "h2",
87
+ regular: true,
88
+ children: title
89
+ }),
90
+ /*#__PURE__*/ _jsx(Text2, {
91
+ as: "p",
92
+ regular: true,
93
+ color: colors.textSecondary,
94
+ children: description
95
+ })
96
+ ]
81
97
  }),
82
- /*#__PURE__*/ _jsx(Text2, {
83
- as: "p",
84
- regular: true,
85
- color: colors.textSecondary,
86
- children: description
98
+ onClose && /*#__PURE__*/ _jsx(IconButton, {
99
+ size: 40,
100
+ style: {
101
+ display: 'flex',
102
+ margin: '-8px -12px',
103
+ alignItems: 'center',
104
+ justifyContent: 'center'
105
+ },
106
+ onPress: onClose,
107
+ "aria-label": texts.closeButtonLabel,
108
+ children: /*#__PURE__*/ _jsx(IconCloseRegular, {
109
+ size: 24,
110
+ color: colors.neutralHigh
111
+ })
87
112
  })
88
113
  ]
89
114
  }),
@@ -94,20 +119,6 @@ var Callout = function(param) {
94
119
  })
95
120
  ]
96
121
  })
97
- }),
98
- onClose && /*#__PURE__*/ _jsx(IconButton, {
99
- size: 40,
100
- style: {
101
- display: 'flex',
102
- margin: '-8px -12px -8px 0',
103
- alignItems: 'center',
104
- justifyContent: 'center'
105
- },
106
- onPress: onClose,
107
- "aria-label": texts.closeButtonLabel,
108
- children: /*#__PURE__*/ _jsx(IconCloseRegular, {
109
- color: colors.neutralHigh
110
- })
111
122
  })
112
123
  ]
113
124
  })
package/dist-es/package-version.js CHANGED
@@ -1,2 +1,2 @@
1
1
  // DO NOT EDIT THIS FILE. It's autogenerated by set-version.js
2
- export var PACKAGE_VERSION = '10.25.0';
2
+ export var PACKAGE_VERSION = '10.26.0';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@telefonica/mistica",
3
- "version": "10.25.0",
3
+ "version": "10.26.0",
4
4
  "license": "MIT",
5
5
  "repository": {
6
6
  "type": "git",