@micromag/element-share-options 0.3.824 → 0.4.4

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.
@@ -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{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;background-color:transparent;color:#fff;font-size:1rem;font-weight:400;justify-content:center;-webkit-text-decoration:none;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);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);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{-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);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-button:focus-visible{-webkit-box-shadow:0 0 2px 2px #fff;box-shadow:0 0 2px 2px #fff;-webkit-box-shadow:0 0 2px 2px var(--micromag-focus-color,#fff);box-shadow:0 0 2px 2px var(--micromag-focus-color,#fff)}.micromag-element-share-options-icon{display:block;position:relative;-ms-flex-negative:0;flex-shrink:0}.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);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{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;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
+ .item+.item{margin-top:.5rem}.button{display:inline-block;display:-ms-inline-flexbox;display:inline-flex;position:relative;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;background-color:transparent;border:0;color:inherit;color:var(--mm-white);cursor:pointer;font-family:inherit;font-size:1rem;font-weight:400;justify-content:center;padding:0;-webkit-text-decoration:none;text-decoration:none;-webkit-transform-origin:0 50%;-ms-transform-origin:0 50%;transform-origin:0 50%;-webkit-transition:-webkit-transform .3s var(--mm-ease-out-ramp);transition:-webkit-transform .3s var(--mm-ease-out-ramp);transition:transform .3s var(--mm-ease-out-ramp);transition:transform .3s var(--mm-ease-out-ramp),-webkit-transform .3s var(--mm-ease-out-ramp)}@media (hover:hover){.button:hover .icon,.button:hover .label{-webkit-transform:scale(1.05);-ms-transform:scale(1.05);transform:scale(1.05);-webkit-transition:-webkit-transform .3s var(--mm-ease-in-yo);transition:-webkit-transform .3s var(--mm-ease-in-yo);transition:transform .3s var(--mm-ease-in-yo);transition:transform .3s var(--mm-ease-in-yo),-webkit-transform .3s var(--mm-ease-in-yo)}}.button:active .icon,.button:active .label,.button:focus .icon,.button:focus .label{-webkit-transform:scale(1.05);-ms-transform:scale(1.05);transform:scale(1.05);-webkit-transition:-webkit-transform .3s var(--mm-ease-in-kickback);transition:-webkit-transform .3s var(--mm-ease-in-kickback);transition:transform .3s var(--mm-ease-in-kickback);transition:transform .3s var(--mm-ease-in-kickback),-webkit-transform .3s var(--mm-ease-in-kickback)}.button:focus-visible{-webkit-box-shadow:0 0 2px 2px #fff;box-shadow:0 0 2px 2px #fff;-webkit-box-shadow:0 0 2px 2px var(--micromag-focus-color,#fff);box-shadow:0 0 2px 2px var(--micromag-focus-color,#fff)}.icon{display:block;position:relative;-ms-flex-negative:0;flex-shrink:0}.icon,.spacer{height:100%;width:45px}.icon,.label{-webkit-transition:-webkit-transform .3s var(--mm-ease-out-ramp);transition:-webkit-transform .3s var(--mm-ease-out-ramp);transition:transform .3s var(--mm-ease-out-ramp);transition:transform .3s var(--mm-ease-out-ramp),-webkit-transform .3s var(--mm-ease-out-ramp)}.label{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;font-size:inherit;justify-content:center;line-height:1;padding:.25rem;-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center}.label,.labelText{margin-left:.25em;margin-right:.25em}.labelText{-ms-flex-negative:0;flex-shrink:0}
package/es/index.d.ts ADDED
@@ -0,0 +1,22 @@
1
+ import * as react_jsx_runtime from 'react/jsx-runtime';
2
+ import { BoxStyle, TextStyle, ViewerTheme } from '@micromag/core';
3
+
4
+ interface ShareOptionsProps {
5
+ className?: string | null;
6
+ itemClassName?: string | null;
7
+ labelClassName?: string | null;
8
+ buttonClassName?: string | null;
9
+ title?: string | null;
10
+ url?: string | null;
11
+ options?: string[] | null;
12
+ buttonsStyle?: BoxStyle | null;
13
+ buttonsTextStyle?: TextStyle | null;
14
+ iconSize?: number;
15
+ theme?: ViewerTheme | null;
16
+ onShare?: ((...args: unknown[]) => void) | null;
17
+ onClose?: ((...args: unknown[]) => void) | null;
18
+ focusable?: boolean;
19
+ }
20
+ declare function ShareOptions({ className, itemClassName, labelClassName, buttonClassName, title, url, options, buttonsStyle, buttonsTextStyle, iconSize, theme, onShare, onClose, focusable, }: ShareOptionsProps): react_jsx_runtime.JSX.Element;
21
+
22
+ export { ShareOptions as default };
package/es/index.js CHANGED
@@ -3,25 +3,17 @@ import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
3
3
  import _objectSpread from '@babel/runtime/helpers/objectSpread2';
4
4
  import classNames from 'classnames';
5
5
  import isArray from 'lodash/isArray';
6
- import PropTypes from 'prop-types';
7
6
  import React, { useState, useCallback, useMemo } from 'react';
8
7
  import { FormattedMessage } from 'react-intl';
9
8
  import { FacebookShareButton, FacebookIcon, TwitterShareButton, TwitterIcon, LinkedinShareButton, LinkedinIcon, WhatsappShareButton, WhatsappIcon, EmailShareButton } from 'react-share';
10
- import { PropTypes as PropTypes$1 } from '@micromag/core';
11
9
  import { Button } from '@micromag/core/components';
12
10
  import { getStyleFromColor, getStyleFromText, getStyleFromBox, copyToClipboard } from '@micromag/core/utils';
13
11
 
14
- var propTypes$3 = {
15
- className: PropTypes.string,
16
- size: PropTypes.number
17
- };
18
- var defaultProps$3 = {
19
- className: null,
20
- size: 45
21
- };
22
- var EmailIcon = function EmailIcon(_ref) {
23
- var className = _ref.className,
24
- size = _ref.size;
12
+ function EmailIcon(_ref) {
13
+ var _ref$className = _ref.className,
14
+ className = _ref$className === void 0 ? null : _ref$className,
15
+ _ref$size = _ref.size,
16
+ size = _ref$size === void 0 ? 45 : _ref$size;
25
17
  return /*#__PURE__*/React.createElement("svg", {
26
18
  width: size,
27
19
  height: size,
@@ -45,21 +37,13 @@ var EmailIcon = function EmailIcon(_ref) {
45
37
  fill: "currentColor",
46
38
  transform: "translate(12 15.28)"
47
39
  }))));
48
- };
49
- EmailIcon.propTypes = propTypes$3;
50
- EmailIcon.defaultProps = defaultProps$3;
40
+ }
51
41
 
52
- var propTypes$2 = {
53
- className: PropTypes.string,
54
- size: PropTypes.number
55
- };
56
- var defaultProps$2 = {
57
- className: null,
58
- size: 45
59
- };
60
- var ShareLinkIcon = function ShareLinkIcon(_ref) {
61
- var className = _ref.className,
62
- size = _ref.size;
42
+ function ShareLinkIcon(_ref) {
43
+ var _ref$className = _ref.className,
44
+ className = _ref$className === void 0 ? null : _ref$className,
45
+ _ref$size = _ref.size,
46
+ size = _ref$size === void 0 ? 45 : _ref$size;
63
47
  return /*#__PURE__*/React.createElement("svg", {
64
48
  xmlns: "http://www.w3.org/2000/svg",
65
49
  width: size,
@@ -81,21 +65,13 @@ var ShareLinkIcon = function ShareLinkIcon(_ref) {
81
65
  strokeLinejoin: "round",
82
66
  strokeWidth: "3"
83
67
  }));
84
- };
85
- ShareLinkIcon.propTypes = propTypes$2;
86
- ShareLinkIcon.defaultProps = defaultProps$2;
68
+ }
87
69
 
88
- var propTypes$1 = {
89
- className: PropTypes.string,
90
- size: PropTypes.number
91
- };
92
- var defaultProps$1 = {
93
- className: null,
94
- size: 45
95
- };
96
- var SmsIcon = function SmsIcon(_ref) {
97
- var className = _ref.className,
98
- size = _ref.size;
70
+ function SmsIcon(_ref) {
71
+ var _ref$className = _ref.className,
72
+ className = _ref$className === void 0 ? null : _ref$className,
73
+ _ref$size = _ref.size,
74
+ size = _ref$size === void 0 ? 45 : _ref$size;
99
75
  return /*#__PURE__*/React.createElement("svg", {
100
76
  width: size,
101
77
  height: size,
@@ -107,59 +83,39 @@ var SmsIcon = function SmsIcon(_ref) {
107
83
  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",
108
84
  fill: "currentColor"
109
85
  }));
110
- };
111
- SmsIcon.propTypes = propTypes$1;
112
- SmsIcon.defaultProps = defaultProps$1;
86
+ }
113
87
 
114
- 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"};
88
+ var styles = {"item":"item","button":"button","icon":"icon","label":"label","spacer":"spacer","labelText":"labelText"};
115
89
 
116
- var propTypes = {
117
- className: PropTypes.string,
118
- itemClassName: PropTypes.string,
119
- labelClassName: PropTypes.string,
120
- buttonClassName: PropTypes.string,
121
- title: PropTypes.string,
122
- url: PropTypes.string,
123
- options: PropTypes.arrayOf(PropTypes.string),
124
- buttonsStyle: PropTypes$1.boxStyle,
125
- buttonsTextStyle: PropTypes$1.textStyle,
126
- iconSize: PropTypes.number,
127
- theme: PropTypes$1.viewerTheme,
128
- onShare: PropTypes.func,
129
- onClose: PropTypes.func,
130
- focusable: PropTypes.bool
131
- };
132
- var defaultProps = {
133
- className: null,
134
- itemClassName: null,
135
- labelClassName: null,
136
- buttonClassName: null,
137
- title: null,
138
- url: null,
139
- options: null,
140
- buttonsStyle: null,
141
- buttonsTextStyle: null,
142
- iconSize: 45,
143
- theme: null,
144
- onShare: null,
145
- onClose: null,
146
- focusable: true
147
- };
148
- var ShareOptions = function ShareOptions(_ref) {
149
- var className = _ref.className,
150
- itemClassName = _ref.itemClassName,
151
- labelClassName = _ref.labelClassName,
152
- buttonClassName = _ref.buttonClassName,
153
- title = _ref.title,
154
- url = _ref.url,
155
- options = _ref.options,
156
- buttonsStyle = _ref.buttonsStyle,
157
- buttonsTextStyle = _ref.buttonsTextStyle,
158
- iconSize = _ref.iconSize,
159
- theme = _ref.theme,
160
- onShare = _ref.onShare,
161
- onClose = _ref.onClose,
162
- focusable = _ref.focusable;
90
+ function ShareOptions(_ref) {
91
+ var _ref$className = _ref.className,
92
+ className = _ref$className === void 0 ? null : _ref$className,
93
+ _ref$itemClassName = _ref.itemClassName,
94
+ itemClassName = _ref$itemClassName === void 0 ? null : _ref$itemClassName,
95
+ _ref$labelClassName = _ref.labelClassName,
96
+ labelClassName = _ref$labelClassName === void 0 ? null : _ref$labelClassName,
97
+ _ref$buttonClassName = _ref.buttonClassName,
98
+ buttonClassName = _ref$buttonClassName === void 0 ? null : _ref$buttonClassName,
99
+ _ref$title = _ref.title,
100
+ title = _ref$title === void 0 ? null : _ref$title,
101
+ _ref$url = _ref.url,
102
+ url = _ref$url === void 0 ? null : _ref$url,
103
+ _ref$options = _ref.options,
104
+ options = _ref$options === void 0 ? null : _ref$options,
105
+ _ref$buttonsStyle = _ref.buttonsStyle,
106
+ buttonsStyle = _ref$buttonsStyle === void 0 ? null : _ref$buttonsStyle,
107
+ _ref$buttonsTextStyle = _ref.buttonsTextStyle,
108
+ buttonsTextStyle = _ref$buttonsTextStyle === void 0 ? null : _ref$buttonsTextStyle,
109
+ _ref$iconSize = _ref.iconSize,
110
+ iconSize = _ref$iconSize === void 0 ? 45 : _ref$iconSize,
111
+ _ref$theme = _ref.theme,
112
+ theme = _ref$theme === void 0 ? null : _ref$theme,
113
+ _ref$onShare = _ref.onShare,
114
+ onShare = _ref$onShare === void 0 ? null : _ref$onShare,
115
+ _ref$onClose = _ref.onClose,
116
+ onClose = _ref$onClose === void 0 ? null : _ref$onClose,
117
+ _ref$focusable = _ref.focusable,
118
+ focusable = _ref$focusable === void 0 ? true : _ref$focusable;
163
119
  var _ref2 = theme || {},
164
120
  _ref2$menuTheme = _ref2.menuTheme,
165
121
  menuTheme = _ref2$menuTheme === void 0 ? null : _ref2$menuTheme;
@@ -409,8 +365,6 @@ var ShareOptions = function ShareOptions(_ref) {
409
365
  className: classNames([styles.item, _defineProperty({}, itemClassName, itemClassName !== null)])
410
366
  }, button);
411
367
  })));
412
- };
413
- ShareOptions.propTypes = propTypes;
414
- ShareOptions.defaultProps = defaultProps;
368
+ }
415
369
 
416
370
  export { ShareOptions as default };
package/es/styles.css ADDED
@@ -0,0 +1 @@
1
+ .item+.item{margin-top:.5rem}.button{display:inline-block;display:-ms-inline-flexbox;display:inline-flex;position:relative;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;background-color:transparent;border:0;color:inherit;color:var(--mm-white);cursor:pointer;font-family:inherit;font-size:1rem;font-weight:400;justify-content:center;padding:0;-webkit-text-decoration:none;text-decoration:none;-webkit-transform-origin:0 50%;-ms-transform-origin:0 50%;transform-origin:0 50%;-webkit-transition:-webkit-transform .3s var(--mm-ease-out-ramp);transition:-webkit-transform .3s var(--mm-ease-out-ramp);transition:transform .3s var(--mm-ease-out-ramp);transition:transform .3s var(--mm-ease-out-ramp),-webkit-transform .3s var(--mm-ease-out-ramp)}@media (hover:hover){.button:hover .icon,.button:hover .label{-webkit-transform:scale(1.05);-ms-transform:scale(1.05);transform:scale(1.05);-webkit-transition:-webkit-transform .3s var(--mm-ease-in-yo);transition:-webkit-transform .3s var(--mm-ease-in-yo);transition:transform .3s var(--mm-ease-in-yo);transition:transform .3s var(--mm-ease-in-yo),-webkit-transform .3s var(--mm-ease-in-yo)}}.button:active .icon,.button:active .label,.button:focus .icon,.button:focus .label{-webkit-transform:scale(1.05);-ms-transform:scale(1.05);transform:scale(1.05);-webkit-transition:-webkit-transform .3s var(--mm-ease-in-kickback);transition:-webkit-transform .3s var(--mm-ease-in-kickback);transition:transform .3s var(--mm-ease-in-kickback);transition:transform .3s var(--mm-ease-in-kickback),-webkit-transform .3s var(--mm-ease-in-kickback)}.button:focus-visible{-webkit-box-shadow:0 0 2px 2px #fff;box-shadow:0 0 2px 2px #fff;-webkit-box-shadow:0 0 2px 2px var(--micromag-focus-color,#fff);box-shadow:0 0 2px 2px var(--micromag-focus-color,#fff)}.icon{display:block;position:relative;-ms-flex-negative:0;flex-shrink:0}.icon,.spacer{height:100%;width:45px}.icon,.label{-webkit-transition:-webkit-transform .3s var(--mm-ease-out-ramp);transition:-webkit-transform .3s var(--mm-ease-out-ramp);transition:transform .3s var(--mm-ease-out-ramp);transition:transform .3s var(--mm-ease-out-ramp),-webkit-transform .3s var(--mm-ease-out-ramp)}.label{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;font-size:inherit;justify-content:center;line-height:1;padding:.25rem;-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center}.label,.labelText{margin-left:.25em;margin-right:.25em}.labelText{-ms-flex-negative:0;flex-shrink:0}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@micromag/element-share-options",
3
- "version": "0.3.824",
3
+ "version": "0.4.4",
4
4
  "private": false,
5
5
  "description": "",
6
6
  "keywords": [
@@ -38,6 +38,7 @@
38
38
  "module": "es/index.js",
39
39
  "exports": {
40
40
  ".": {
41
+ "types": "./es/index.d.ts",
41
42
  "import": "./es/index.js"
42
43
  },
43
44
  "./assets/css/styles": "./assets/css/styles.css",
@@ -51,23 +52,22 @@
51
52
  "scripts": {
52
53
  "clean": "rm -rf es && rm -rf lib && rm -rf assets",
53
54
  "prepublishOnly": "npm run build",
54
- "build": "../../scripts/prepare-package.sh"
55
+ "build": "../../scripts/prepare-package.sh --types"
55
56
  },
56
57
  "devDependencies": {
57
- "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
58
- "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0"
58
+ "react": "^19.2.0",
59
+ "react-dom": "^18.3.0 || ^19.0.0"
59
60
  },
60
61
  "peerDependencies": {
61
- "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
62
- "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0"
62
+ "react": "^19.2.0",
63
+ "react-dom": "^18.3.0 || ^19.0.0"
63
64
  },
64
65
  "dependencies": {
65
66
  "@babel/runtime": "^7.13.10",
66
- "@micromag/core": "^0.3.824",
67
+ "@micromag/core": "^0.4.4",
67
68
  "classnames": "^2.2.6",
68
- "lodash": "^4.17.21",
69
- "prop-types": "^15.7.2",
70
- "react-intl": "^6.6.4",
69
+ "lodash": "^4.17.23",
70
+ "react-intl": "^8.1.3",
71
71
  "react-share": "^5.1.0",
72
72
  "uuid": "^9.0.0"
73
73
  },
@@ -75,5 +75,6 @@
75
75
  "access": "public",
76
76
  "registry": "https://registry.npmjs.org/"
77
77
  },
78
- "gitHead": "e266e480cdc5741c73160840affee2eac7e7c9de"
78
+ "gitHead": "04b8519c3a3ddace5a21497e22faa11865d57f6d",
79
+ "types": "es/index.d.ts"
79
80
  }