@micromag/element-share-options 0.3.373 → 0.3.379

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 (4) hide show
  1. package/assets/css/styles.css +1 -1
  2. package/es/index.js +99 -10
  3. package/lib/index.js +99 -10
  4. package/package.json +3 -3
package/assets/css/styles.css CHANGED
@@ -1 +1 @@
1
- .micromag-element-share-options-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:0;color:inherit;cursor:pointer;display:inline-block;font-family:inherit;padding:0;position:relative}.micromag-element-share-options-item+.micromag-element-share-options-item{margin-top:.5rem}.micromag-element-share-options-button{-ms-flex-align:center;-ms-flex-pack:center;align-items:center;background-color:transparent;color:#fff;display:-ms-inline-flexbox;display:inline-flex;font-size:1rem;font-weight:400;justify-content:center;-webkit-transform-origin:0 50%;-ms-transform-origin:0 50%;transform-origin:0 50%;-webkit-transition:-webkit-transform .3s cubic-bezier(0,.6,.5,1);transition:-webkit-transform .3s cubic-bezier(0,.6,.5,1);-o-transition:transform .3s cubic-bezier(0,.6,.5,1);transition:transform .3s cubic-bezier(0,.6,.5,1);transition:transform .3s cubic-bezier(0,.6,.5,1),-webkit-transform .3s cubic-bezier(0,.6,.5,1)}@media (hover:hover){.micromag-element-share-options-button:hover .micromag-element-share-options-icon,.micromag-element-share-options-button:hover .micromag-element-share-options-label{-webkit-transform:scale(1.05);-ms-transform:scale(1.05);transform:scale(1.05);-webkit-transition:-webkit-transform .3s cubic-bezier(.21,2.59,0,.9);transition:-webkit-transform .3s cubic-bezier(.21,2.59,0,.9);-o-transition:transform .3s cubic-bezier(.21,2.59,0,.9);transition:transform .3s cubic-bezier(.21,2.59,0,.9);transition:transform .3s cubic-bezier(.21,2.59,0,.9),-webkit-transform .3s cubic-bezier(.21,2.59,0,.9)}}.micromag-element-share-options-button:active .micromag-element-share-options-icon,.micromag-element-share-options-button:active .micromag-element-share-options-label{-webkit-transform:scale(1.05);-ms-transform:scale(1.05);transform:scale(1.05);-webkit-transition:-webkit-transform .3s cubic-bezier(.41,1.69,.04,.67);transition:-webkit-transform .3s cubic-bezier(.41,1.69,.04,.67);-o-transition:transform .3s cubic-bezier(.41,1.69,.04,.67);transition:transform .3s cubic-bezier(.41,1.69,.04,.67);transition:transform .3s cubic-bezier(.41,1.69,.04,.67),-webkit-transform .3s cubic-bezier(.41,1.69,.04,.67)}.micromag-element-share-options-icon{-ms-flex-negative:0;display:block;flex-shrink:0;position:relative}.micromag-element-share-options-icon,.micromag-element-share-options-spacer{height:100%;width:45px}.micromag-element-share-options-icon,.micromag-element-share-options-label{-webkit-transition:-webkit-transform .3s cubic-bezier(0,.6,.5,1);transition:-webkit-transform .3s cubic-bezier(0,.6,.5,1);-o-transition:transform .3s cubic-bezier(0,.6,.5,1);transition:transform .3s cubic-bezier(0,.6,.5,1);transition:transform .3s cubic-bezier(0,.6,.5,1),-webkit-transform .3s cubic-bezier(0,.6,.5,1)}.micromag-element-share-options-label{-ms-flex-positive:1;-ms-flex-align:center;-ms-flex-pack:center;align-items:center;display:-ms-flexbox;display:flex;flex-grow:1;font-size:inherit;justify-content:center;line-height:1;margin-left:.25em;margin-right:.25em;padding:.25rem;-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center}.micromag-element-share-options-labelText{-ms-flex-negative:0;flex-shrink:0;margin-left:.25em;margin-right:.25em}
1
+ .micromag-element-share-options-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:0;color:inherit;cursor:pointer;display:inline-block;font-family:inherit;padding:0;position:relative}.micromag-element-share-options-item+.micromag-element-share-options-item{margin-top:.5rem}.micromag-element-share-options-button{-ms-flex-align:center;-ms-flex-pack:center;align-items:center;background-color:transparent;color:#fff;display:-ms-inline-flexbox;display:inline-flex;font-size:1rem;font-weight:400;justify-content:center;text-decoration:none;-webkit-transform-origin:0 50%;-ms-transform-origin:0 50%;transform-origin:0 50%;-webkit-transition:-webkit-transform .3s cubic-bezier(0,.6,.5,1);transition:-webkit-transform .3s cubic-bezier(0,.6,.5,1);-o-transition:transform .3s cubic-bezier(0,.6,.5,1);transition:transform .3s cubic-bezier(0,.6,.5,1);transition:transform .3s cubic-bezier(0,.6,.5,1),-webkit-transform .3s cubic-bezier(0,.6,.5,1)}@media (hover:hover){.micromag-element-share-options-button:hover .micromag-element-share-options-icon,.micromag-element-share-options-button:hover .micromag-element-share-options-label{color:#fff;-webkit-transform:scale(1.05);-ms-transform:scale(1.05);transform:scale(1.05);-webkit-transition:-webkit-transform .3s cubic-bezier(.21,2.59,0,.9);transition:-webkit-transform .3s cubic-bezier(.21,2.59,0,.9);-o-transition:transform .3s cubic-bezier(.21,2.59,0,.9);transition:transform .3s cubic-bezier(.21,2.59,0,.9);transition:transform .3s cubic-bezier(.21,2.59,0,.9),-webkit-transform .3s cubic-bezier(.21,2.59,0,.9)}}.micromag-element-share-options-button:active .micromag-element-share-options-icon,.micromag-element-share-options-button:active .micromag-element-share-options-label,.micromag-element-share-options-button:focus .micromag-element-share-options-icon,.micromag-element-share-options-button:focus .micromag-element-share-options-label{color:#fff;-webkit-transform:scale(1.05);-ms-transform:scale(1.05);transform:scale(1.05);-webkit-transition:-webkit-transform .3s cubic-bezier(.41,1.69,.04,.67);transition:-webkit-transform .3s cubic-bezier(.41,1.69,.04,.67);-o-transition:transform .3s cubic-bezier(.41,1.69,.04,.67);transition:transform .3s cubic-bezier(.41,1.69,.04,.67);transition:transform .3s cubic-bezier(.41,1.69,.04,.67),-webkit-transform .3s cubic-bezier(.41,1.69,.04,.67)}.micromag-element-share-options-icon{-ms-flex-negative:0;display:block;flex-shrink:0;position:relative}.micromag-element-share-options-icon,.micromag-element-share-options-spacer{height:100%;width:45px}.micromag-element-share-options-icon,.micromag-element-share-options-label{-webkit-transition:-webkit-transform .3s cubic-bezier(0,.6,.5,1);transition:-webkit-transform .3s cubic-bezier(0,.6,.5,1);-o-transition:transform .3s cubic-bezier(0,.6,.5,1);transition:transform .3s cubic-bezier(0,.6,.5,1);transition:transform .3s cubic-bezier(0,.6,.5,1),-webkit-transform .3s cubic-bezier(0,.6,.5,1)}.micromag-element-share-options-label{-ms-flex-positive:1;-ms-flex-align:center;-ms-flex-pack:center;align-items:center;display:-ms-flexbox;display:flex;flex-grow:1;font-size:inherit;justify-content:center;line-height:1;margin-left:.25em;margin-right:.25em;padding:.25rem;-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center}.micromag-element-share-options-labelText{-ms-flex-negative:0;flex-shrink:0;margin-left:.25em;margin-right:.25em}
package/es/index.js CHANGED
@@ -5,16 +5,54 @@ import classNames from 'classnames';
5
5
  import PropTypes from 'prop-types';
6
6
  import React, { useState, useCallback, useMemo } from 'react';
7
7
  import { FormattedMessage } from 'react-intl';
8
- import { FacebookShareButton, FacebookIcon, TwitterShareButton, TwitterIcon, LinkedinShareButton, LinkedinIcon, WhatsappShareButton, WhatsappIcon, EmailShareButton, EmailIcon } from 'react-share';
8
+ import { FacebookShareButton, FacebookIcon, TwitterShareButton, TwitterIcon, LinkedinShareButton, LinkedinIcon, WhatsappShareButton, WhatsappIcon, EmailShareButton } from 'react-share';
9
9
  import { PropTypes as PropTypes$1 } from '@micromag/core';
10
10
  import { Button } from '@micromag/core/components';
11
11
  import { getStyleFromColor, getStyleFromText, getStyleFromBox, copyToClipboard } from '@micromag/core/utils';
12
12
 
13
- var propTypes$1 = {
13
+ var propTypes$3 = {
14
14
  className: PropTypes.string,
15
15
  size: PropTypes.number
16
16
  };
17
- var defaultProps$1 = {
17
+ var defaultProps$3 = {
18
+ className: null,
19
+ size: 45
20
+ };
21
+ var EmailIcon = function EmailIcon(_ref) {
22
+ var className = _ref.className,
23
+ size = _ref.size;
24
+ return /*#__PURE__*/React.createElement("svg", {
25
+ width: size,
26
+ height: size,
27
+ viewBox: "0 0 45 45",
28
+ fill: "none",
29
+ xmlns: "http://www.w3.org/2000/svg",
30
+ className: classNames([_defineProperty({}, className, className !== null)])
31
+ }, /*#__PURE__*/React.createElement("g", {
32
+ clipPath: "url(#clip0_837_18233)"
33
+ }, /*#__PURE__*/React.createElement("path", {
34
+ d: "M32.8293 17.0498L27.3973 22.5436C27.3582 22.5825 27.3582 22.6453 27.3973 22.6842L31.1987 26.7044C31.4557 26.9576 31.4568 27.3694 31.2007 27.6247L31.1987 27.6267C30.9417 27.8809 30.526 27.8809 30.2699 27.6267L26.4836 23.6214C26.4435 23.5816 26.3782 23.5816 26.337 23.6214L25.4143 24.5557C24.6512 25.3304 23.607 25.7671 22.5156 25.7691C21.4011 25.7631 20.3367 25.3135 19.5606 24.5198L18.672 23.6224C18.6318 23.5826 18.5666 23.5826 18.5254 23.6224L14.7371 27.6286C14.48 27.8829 14.0644 27.8829 13.8083 27.6286C13.5513 27.3754 13.5503 26.9636 13.8063 26.7084L13.8083 26.7064L17.6097 22.6862C17.6448 22.6463 17.6448 22.5855 17.6097 22.5456L12.1717 17.0498C12.1335 17.0109 12.0703 17.0099 12.0301 17.0478C12.011 17.0667 12 17.0927 12 17.1196V28.1132C12.003 28.9976 12.7239 29.7145 13.6155 29.7175H31.3855C32.2761 29.7145 32.998 28.9986 33.001 28.1132V17.1196C33.001 17.0647 32.9568 17.0199 32.9016 17.0199C32.8745 17.0199 32.8484 17.0308 32.8293 17.0498Z",
35
+ fill: "currentColor"
36
+ }), /*#__PURE__*/React.createElement("path", {
37
+ d: "M22.4995 24.459C23.2425 24.461 23.9544 24.1648 24.4735 23.6364L32.3946 15.631C32.1114 15.4036 31.759 15.28 31.3955 15.28H13.6105C13.246 15.279 12.8936 15.4026 12.6105 15.631L20.5305 23.6364C21.0476 24.1628 21.7585 24.46 22.4995 24.459Z",
38
+ fill: "currentColor"
39
+ })), /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("clipPath", {
40
+ id: "clip0_837_18233"
41
+ }, /*#__PURE__*/React.createElement("rect", {
42
+ width: "21",
43
+ height: "14.4375",
44
+ fill: "currentColor",
45
+ transform: "translate(12 15.28)"
46
+ }))));
47
+ };
48
+ EmailIcon.propTypes = propTypes$3;
49
+ EmailIcon.defaultProps = defaultProps$3;
50
+
51
+ var propTypes$2 = {
52
+ className: PropTypes.string,
53
+ size: PropTypes.number
54
+ };
55
+ var defaultProps$2 = {
18
56
  className: null,
19
57
  size: 45
20
58
  };
@@ -43,8 +81,34 @@ var ShareLinkIcon = function ShareLinkIcon(_ref) {
43
81
  strokeWidth: "3"
44
82
  }));
45
83
  };
46
- ShareLinkIcon.propTypes = propTypes$1;
47
- ShareLinkIcon.defaultProps = defaultProps$1;
84
+ ShareLinkIcon.propTypes = propTypes$2;
85
+ ShareLinkIcon.defaultProps = defaultProps$2;
86
+
87
+ var propTypes$1 = {
88
+ className: PropTypes.string,
89
+ size: PropTypes.number
90
+ };
91
+ var defaultProps$1 = {
92
+ className: null,
93
+ size: 45
94
+ };
95
+ var SmsIcon = function SmsIcon(_ref) {
96
+ var className = _ref.className,
97
+ size = _ref.size;
98
+ return /*#__PURE__*/React.createElement("svg", {
99
+ width: size,
100
+ height: size,
101
+ viewBox: "0 0 45 45",
102
+ fill: "none",
103
+ xmlns: "http://www.w3.org/2000/svg",
104
+ className: classNames([_defineProperty({}, className, className !== null)])
105
+ }, /*#__PURE__*/React.createElement("path", {
106
+ d: "M30.8988 12H14.1001C12.9444 12.0053 12.0106 12.9444 12.0106 14.1001L12 32.9989L16.2002 28.7987H30.8999C32.0578 28.7955 32.9968 27.8576 33 26.6986V14.1001C32.9968 12.9422 32.0588 12.0032 30.8999 12H30.8988ZM19.3498 20.3999C19.3498 20.9798 18.8797 21.4499 18.2998 21.4499V21.4499C17.7199 21.4499 17.2497 20.9798 17.2497 20.3999V20.3999C17.2497 19.82 17.7199 19.3498 18.2998 19.3498V19.3498C18.8797 19.3498 19.3498 19.82 19.3498 20.3999V20.3999ZM23.5501 20.3999C23.5501 20.9798 23.0799 21.4499 22.5 21.4499V21.4499C21.9201 21.4499 21.4499 20.9798 21.4499 20.3999V20.3999C21.4499 19.82 21.9201 19.3498 22.5 19.3498V19.3498C23.0799 19.3498 23.5501 19.82 23.5501 20.3999V20.3999ZM27.7503 20.3999C27.7503 20.9798 27.2801 21.4499 26.7002 21.4499V21.4499C26.1203 21.4499 25.6502 20.9798 25.6502 20.3999V20.3999C25.6502 19.82 26.1203 19.3498 26.7002 19.3498V19.3498C27.2801 19.3498 27.7503 19.82 27.7503 20.3999V20.3999Z",
107
+ fill: "currentColor"
108
+ }));
109
+ };
110
+ SmsIcon.propTypes = propTypes$1;
111
+ SmsIcon.defaultProps = defaultProps$1;
48
112
 
49
113
  var styles = {"button":"micromag-element-share-options-button","item":"micromag-element-share-options-item","icon":"micromag-element-share-options-icon","label":"micromag-element-share-options-label","spacer":"micromag-element-share-options-spacer","labelText":"micromag-element-share-options-labelText"};
50
114
 
@@ -81,7 +145,7 @@ var defaultProps = {
81
145
  focusable: true
82
146
  };
83
147
  var ShareOptions = function ShareOptions(_ref) {
84
- var _ref12;
148
+ var _ref14;
85
149
  var className = _ref.className,
86
150
  itemClassName = _ref.itemClassName,
87
151
  labelClassName = _ref.labelClassName,
@@ -274,6 +338,31 @@ var ShareOptions = function ShareOptions(_ref) {
274
338
  width: "".concat(iconSize, "px")
275
339
  }
276
340
  }))
341
+ }, {
342
+ id: 'sms',
343
+ button: /*#__PURE__*/React.createElement(Button, {
344
+ className: classNames([styles.button, _defineProperty({}, buttonClassName, buttonClassName !== null)]),
345
+ href: "sms:?&body=".concat(url),
346
+ focusable: focusable,
347
+ style: finalStyles,
348
+ external: true,
349
+ withoutBootstrapStyles: true
350
+ }, /*#__PURE__*/React.createElement(SmsIcon, shareIconProps), /*#__PURE__*/React.createElement("div", {
351
+ className: classNames([styles.label, _defineProperty({}, labelClassName, labelClassName !== null)])
352
+ }, /*#__PURE__*/React.createElement("span", {
353
+ className: styles.labelText
354
+ }, /*#__PURE__*/React.createElement(FormattedMessage, {
355
+ id: "dSfmnf",
356
+ defaultMessage: [{
357
+ "type": 0,
358
+ "value": "SMS"
359
+ }]
360
+ }))), /*#__PURE__*/React.createElement("div", {
361
+ className: styles.spacer,
362
+ style: {
363
+ width: "".concat(iconSize, "px")
364
+ }
365
+ }))
277
366
  }];
278
367
  var hasShareLink = options !== null ? options.includes('copylink') : true; // default is true
279
368
  var selectedOptions = options !== null ? shareOptions.filter(function (opt) {
@@ -284,7 +373,7 @@ var ShareOptions = function ShareOptions(_ref) {
284
373
  }, /*#__PURE__*/React.createElement("div", {
285
374
  className: styles.options
286
375
  }, hasShareLink ? /*#__PURE__*/React.createElement("div", {
287
- className: classNames([styles.item, (_ref12 = {}, _defineProperty(_ref12, itemClassName, itemClassName !== null), _defineProperty(_ref12, styles.isLinkCopied, linkCopied), _ref12)])
376
+ className: classNames([styles.item, (_ref14 = {}, _defineProperty(_ref14, itemClassName, itemClassName !== null), _defineProperty(_ref14, styles.isLinkCopied, linkCopied), _ref14)])
288
377
  }, /*#__PURE__*/React.createElement(Button, {
289
378
  className: classNames([styles.button, _defineProperty({}, buttonClassName, buttonClassName !== null)]),
290
379
  onClick: onClickCopy,
@@ -312,9 +401,9 @@ var ShareOptions = function ShareOptions(_ref) {
312
401
  style: {
313
402
  width: "".concat(iconSize, "px")
314
403
  }
315
- }))) : null, selectedOptions.map(function (_ref15) {
316
- var id = _ref15.id,
317
- button = _ref15.button;
404
+ }))) : null, selectedOptions.map(function (_ref17) {
405
+ var id = _ref17.id,
406
+ button = _ref17.button;
318
407
  return /*#__PURE__*/React.createElement("div", {
319
408
  key: id,
320
409
  className: classNames([styles.item, _defineProperty({}, itemClassName, itemClassName !== null)])
package/lib/index.js CHANGED
@@ -21,11 +21,49 @@ var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
21
21
  var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
22
22
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
23
23
 
24
- var propTypes$1 = {
24
+ var propTypes$3 = {
25
25
  className: PropTypes__default["default"].string,
26
26
  size: PropTypes__default["default"].number
27
27
  };
28
- var defaultProps$1 = {
28
+ var defaultProps$3 = {
29
+ className: null,
30
+ size: 45
31
+ };
32
+ var EmailIcon = function EmailIcon(_ref) {
33
+ var className = _ref.className,
34
+ size = _ref.size;
35
+ return /*#__PURE__*/React__default["default"].createElement("svg", {
36
+ width: size,
37
+ height: size,
38
+ viewBox: "0 0 45 45",
39
+ fill: "none",
40
+ xmlns: "http://www.w3.org/2000/svg",
41
+ className: classNames__default["default"]([_defineProperty__default["default"]({}, className, className !== null)])
42
+ }, /*#__PURE__*/React__default["default"].createElement("g", {
43
+ clipPath: "url(#clip0_837_18233)"
44
+ }, /*#__PURE__*/React__default["default"].createElement("path", {
45
+ d: "M32.8293 17.0498L27.3973 22.5436C27.3582 22.5825 27.3582 22.6453 27.3973 22.6842L31.1987 26.7044C31.4557 26.9576 31.4568 27.3694 31.2007 27.6247L31.1987 27.6267C30.9417 27.8809 30.526 27.8809 30.2699 27.6267L26.4836 23.6214C26.4435 23.5816 26.3782 23.5816 26.337 23.6214L25.4143 24.5557C24.6512 25.3304 23.607 25.7671 22.5156 25.7691C21.4011 25.7631 20.3367 25.3135 19.5606 24.5198L18.672 23.6224C18.6318 23.5826 18.5666 23.5826 18.5254 23.6224L14.7371 27.6286C14.48 27.8829 14.0644 27.8829 13.8083 27.6286C13.5513 27.3754 13.5503 26.9636 13.8063 26.7084L13.8083 26.7064L17.6097 22.6862C17.6448 22.6463 17.6448 22.5855 17.6097 22.5456L12.1717 17.0498C12.1335 17.0109 12.0703 17.0099 12.0301 17.0478C12.011 17.0667 12 17.0927 12 17.1196V28.1132C12.003 28.9976 12.7239 29.7145 13.6155 29.7175H31.3855C32.2761 29.7145 32.998 28.9986 33.001 28.1132V17.1196C33.001 17.0647 32.9568 17.0199 32.9016 17.0199C32.8745 17.0199 32.8484 17.0308 32.8293 17.0498Z",
46
+ fill: "currentColor"
47
+ }), /*#__PURE__*/React__default["default"].createElement("path", {
48
+ d: "M22.4995 24.459C23.2425 24.461 23.9544 24.1648 24.4735 23.6364L32.3946 15.631C32.1114 15.4036 31.759 15.28 31.3955 15.28H13.6105C13.246 15.279 12.8936 15.4026 12.6105 15.631L20.5305 23.6364C21.0476 24.1628 21.7585 24.46 22.4995 24.459Z",
49
+ fill: "currentColor"
50
+ })), /*#__PURE__*/React__default["default"].createElement("defs", null, /*#__PURE__*/React__default["default"].createElement("clipPath", {
51
+ id: "clip0_837_18233"
52
+ }, /*#__PURE__*/React__default["default"].createElement("rect", {
53
+ width: "21",
54
+ height: "14.4375",
55
+ fill: "currentColor",
56
+ transform: "translate(12 15.28)"
57
+ }))));
58
+ };
59
+ EmailIcon.propTypes = propTypes$3;
60
+ EmailIcon.defaultProps = defaultProps$3;
61
+
62
+ var propTypes$2 = {
63
+ className: PropTypes__default["default"].string,
64
+ size: PropTypes__default["default"].number
65
+ };
66
+ var defaultProps$2 = {
29
67
  className: null,
30
68
  size: 45
31
69
  };
@@ -54,8 +92,34 @@ var ShareLinkIcon = function ShareLinkIcon(_ref) {
54
92
  strokeWidth: "3"
55
93
  }));
56
94
  };
57
- ShareLinkIcon.propTypes = propTypes$1;
58
- ShareLinkIcon.defaultProps = defaultProps$1;
95
+ ShareLinkIcon.propTypes = propTypes$2;
96
+ ShareLinkIcon.defaultProps = defaultProps$2;
97
+
98
+ var propTypes$1 = {
99
+ className: PropTypes__default["default"].string,
100
+ size: PropTypes__default["default"].number
101
+ };
102
+ var defaultProps$1 = {
103
+ className: null,
104
+ size: 45
105
+ };
106
+ var SmsIcon = function SmsIcon(_ref) {
107
+ var className = _ref.className,
108
+ size = _ref.size;
109
+ return /*#__PURE__*/React__default["default"].createElement("svg", {
110
+ width: size,
111
+ height: size,
112
+ viewBox: "0 0 45 45",
113
+ fill: "none",
114
+ xmlns: "http://www.w3.org/2000/svg",
115
+ className: classNames__default["default"]([_defineProperty__default["default"]({}, className, className !== null)])
116
+ }, /*#__PURE__*/React__default["default"].createElement("path", {
117
+ d: "M30.8988 12H14.1001C12.9444 12.0053 12.0106 12.9444 12.0106 14.1001L12 32.9989L16.2002 28.7987H30.8999C32.0578 28.7955 32.9968 27.8576 33 26.6986V14.1001C32.9968 12.9422 32.0588 12.0032 30.8999 12H30.8988ZM19.3498 20.3999C19.3498 20.9798 18.8797 21.4499 18.2998 21.4499V21.4499C17.7199 21.4499 17.2497 20.9798 17.2497 20.3999V20.3999C17.2497 19.82 17.7199 19.3498 18.2998 19.3498V19.3498C18.8797 19.3498 19.3498 19.82 19.3498 20.3999V20.3999ZM23.5501 20.3999C23.5501 20.9798 23.0799 21.4499 22.5 21.4499V21.4499C21.9201 21.4499 21.4499 20.9798 21.4499 20.3999V20.3999C21.4499 19.82 21.9201 19.3498 22.5 19.3498V19.3498C23.0799 19.3498 23.5501 19.82 23.5501 20.3999V20.3999ZM27.7503 20.3999C27.7503 20.9798 27.2801 21.4499 26.7002 21.4499V21.4499C26.1203 21.4499 25.6502 20.9798 25.6502 20.3999V20.3999C25.6502 19.82 26.1203 19.3498 26.7002 19.3498V19.3498C27.2801 19.3498 27.7503 19.82 27.7503 20.3999V20.3999Z",
118
+ fill: "currentColor"
119
+ }));
120
+ };
121
+ SmsIcon.propTypes = propTypes$1;
122
+ SmsIcon.defaultProps = defaultProps$1;
59
123
 
60
124
  var styles = {"button":"micromag-element-share-options-button","item":"micromag-element-share-options-item","icon":"micromag-element-share-options-icon","label":"micromag-element-share-options-label","spacer":"micromag-element-share-options-spacer","labelText":"micromag-element-share-options-labelText"};
61
125
 
@@ -92,7 +156,7 @@ var defaultProps = {
92
156
  focusable: true
93
157
  };
94
158
  var ShareOptions = function ShareOptions(_ref) {
95
- var _ref12;
159
+ var _ref14;
96
160
  var className = _ref.className,
97
161
  itemClassName = _ref.itemClassName,
98
162
  labelClassName = _ref.labelClassName,
@@ -271,7 +335,7 @@ var ShareOptions = function ShareOptions(_ref) {
271
335
  },
272
336
  tabIndex: focusable ? null : '-1',
273
337
  style: finalStyles
274
- }), /*#__PURE__*/React__default["default"].createElement(reactShare.EmailIcon, shareIconProps), /*#__PURE__*/React__default["default"].createElement("div", {
338
+ }), /*#__PURE__*/React__default["default"].createElement(EmailIcon, shareIconProps), /*#__PURE__*/React__default["default"].createElement("div", {
275
339
  className: classNames__default["default"]([styles.label, _defineProperty__default["default"]({}, labelClassName, labelClassName !== null)])
276
340
  }, /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, {
277
341
  id: "Lrwi2G",
@@ -285,6 +349,31 @@ var ShareOptions = function ShareOptions(_ref) {
285
349
  width: "".concat(iconSize, "px")
286
350
  }
287
351
  }))
352
+ }, {
353
+ id: 'sms',
354
+ button: /*#__PURE__*/React__default["default"].createElement(components.Button, {
355
+ className: classNames__default["default"]([styles.button, _defineProperty__default["default"]({}, buttonClassName, buttonClassName !== null)]),
356
+ href: "sms:?&body=".concat(url),
357
+ focusable: focusable,
358
+ style: finalStyles,
359
+ external: true,
360
+ withoutBootstrapStyles: true
361
+ }, /*#__PURE__*/React__default["default"].createElement(SmsIcon, shareIconProps), /*#__PURE__*/React__default["default"].createElement("div", {
362
+ className: classNames__default["default"]([styles.label, _defineProperty__default["default"]({}, labelClassName, labelClassName !== null)])
363
+ }, /*#__PURE__*/React__default["default"].createElement("span", {
364
+ className: styles.labelText
365
+ }, /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, {
366
+ id: "dSfmnf",
367
+ defaultMessage: [{
368
+ "type": 0,
369
+ "value": "SMS"
370
+ }]
371
+ }))), /*#__PURE__*/React__default["default"].createElement("div", {
372
+ className: styles.spacer,
373
+ style: {
374
+ width: "".concat(iconSize, "px")
375
+ }
376
+ }))
288
377
  }];
289
378
  var hasShareLink = options !== null ? options.includes('copylink') : true; // default is true
290
379
  var selectedOptions = options !== null ? shareOptions.filter(function (opt) {
@@ -295,7 +384,7 @@ var ShareOptions = function ShareOptions(_ref) {
295
384
  }, /*#__PURE__*/React__default["default"].createElement("div", {
296
385
  className: styles.options
297
386
  }, hasShareLink ? /*#__PURE__*/React__default["default"].createElement("div", {
298
- className: classNames__default["default"]([styles.item, (_ref12 = {}, _defineProperty__default["default"](_ref12, itemClassName, itemClassName !== null), _defineProperty__default["default"](_ref12, styles.isLinkCopied, linkCopied), _ref12)])
387
+ className: classNames__default["default"]([styles.item, (_ref14 = {}, _defineProperty__default["default"](_ref14, itemClassName, itemClassName !== null), _defineProperty__default["default"](_ref14, styles.isLinkCopied, linkCopied), _ref14)])
299
388
  }, /*#__PURE__*/React__default["default"].createElement(components.Button, {
300
389
  className: classNames__default["default"]([styles.button, _defineProperty__default["default"]({}, buttonClassName, buttonClassName !== null)]),
301
390
  onClick: onClickCopy,
@@ -323,9 +412,9 @@ var ShareOptions = function ShareOptions(_ref) {
323
412
  style: {
324
413
  width: "".concat(iconSize, "px")
325
414
  }
326
- }))) : null, selectedOptions.map(function (_ref15) {
327
- var id = _ref15.id,
328
- button = _ref15.button;
415
+ }))) : null, selectedOptions.map(function (_ref17) {
416
+ var id = _ref17.id,
417
+ button = _ref17.button;
329
418
  return /*#__PURE__*/React__default["default"].createElement("div", {
330
419
  key: id,
331
420
  className: classNames__default["default"]([styles.item, _defineProperty__default["default"]({}, itemClassName, itemClassName !== null)])
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@micromag/element-share-options",
3
- "version": "0.3.373",
3
+ "version": "0.3.379",
4
4
  "description": "",
5
5
  "keywords": [
6
6
  "javascript"
@@ -53,7 +53,7 @@
53
53
  },
54
54
  "dependencies": {
55
55
  "@babel/runtime": "^7.13.10",
56
- "@micromag/core": "^0.3.373",
56
+ "@micromag/core": "^0.3.379",
57
57
  "classnames": "^2.2.6",
58
58
  "prop-types": "^15.7.2",
59
59
  "react-intl": "^5.12.1",
@@ -63,5 +63,5 @@
63
63
  "publishConfig": {
64
64
  "access": "public"
65
65
  },
66
- "gitHead": "072c8a8e64514933e9d13e4ad99778c2cbcc6968"
66
+ "gitHead": "74875407db738009dda84849ce467adfd4508e4e"
67
67
  }