@telefonica/mistica 12.4.0 → 12.5.0

package/dist/button.d.ts

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import type { TouchableElement } from './touchable';
 import type { DataAttributes, RendersElement, RendersNullableElement, TrackingEvent } from './utils/types';
 import type { Location } from 'history';
 export declare const BUTTON_MIN_WIDTH = 136;
@@ -84,10 +85,10 @@ interface ButtonLinkToProps extends ButtonLinkCommonProps {
     href?: undefined;
 }
 export declare type ButtonLinkProps = ButtonLinkOnPressProps | ButtonLinkHrefProps | ButtonLinkToProps;
-export declare const ButtonLink: React.ForwardRefExoticComponent<ButtonLinkProps & React.RefAttributes<HTMLAnchorElement | HTMLDivElement | HTMLButtonElement>>;
-export declare const ButtonPrimary: React.FC<ButtonProps>;
-export declare const ButtonSecondary: React.FC<ButtonProps>;
-export declare const ButtonDanger: React.FC<ButtonProps>;
+export declare const ButtonLink: React.ForwardRefExoticComponent<ButtonLinkProps & React.RefAttributes<TouchableElement>>;
+export declare const ButtonPrimary: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<TouchableElement>>;
+export declare const ButtonSecondary: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<TouchableElement>>;
+export declare const ButtonDanger: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<TouchableElement>>;
 export declare type ButtonElement = RendersElement<typeof ButtonPrimary> | RendersElement<typeof ButtonSecondary> | RendersElement<typeof ButtonDanger>;
 export declare type NullableButtonElement = RendersNullableElement<typeof ButtonPrimary> | RendersNullableElement<typeof ButtonSecondary> | RendersNullableElement<typeof ButtonDanger>;
 export {};

package/dist/button.js

@@ -346,9 +346,9 @@ var renderButtonContent = function renderButtonContent(param) {
     });
     return resultChildrenArr;
 };
-var Button = function Button(props) {
+var Button = /*#__PURE__*/ React.forwardRef(function(props, ref) {
     var eventFormat = (0, _analytics).useTrackingConfig().eventFormat;
-    var ref = (0, _formContext).useForm(), formStatus = ref.formStatus, formId = ref.formId;
+    var _$ref = (0, _formContext).useForm(), formStatus = _$ref.formStatus, formId = _$ref.formId;
     var isInverse = (0, _themeVariantContext).useIsInverseVariant();
     var classes = props.classes, loadingText = props.loadingText;
     var isSubmitButton = !!props.submit;
@@ -358,7 +358,7 @@ var Button = function Button(props) {
     // specially in iPhone). But we want the spinner to be visible during the show/hide animation.
     // * When showSpinner prop is true, state is changed immediately.
     // * When the transition ends this state is updated again if needed
-    var ref1 = _slicedToArray(React.useState(!!showSpinner), 2), shouldRenderSpinner = ref1[0], setShouldRenderSpinner = ref1[1];
+    var _$ref1 = _slicedToArray(React.useState(!!showSpinner), 2), shouldRenderSpinner = _$ref1[0], setShouldRenderSpinner = _$ref1[1];
     React.useEffect(function() {
         if (showSpinner && !shouldRenderSpinner) {
             setShouldRenderSpinner(true);
@@ -405,6 +405,7 @@ var Button = function Button(props) {
     var _trackingEvent;
     var _obj;
     var commonProps = {
+        ref: ref,
         className: (0, _classnames).default(classes.button, props.className, (_obj = {}, _defineProperty(_obj, classes.small, props.small), _defineProperty(_obj, classes.inverse, isInverse), _defineProperty(_obj, classes.light, !isInverse), _defineProperty(_obj, classes.isLoading, showSpinner), _obj)),
         style: _objectSpread({
             cursor: props.fake ? "pointer" : undefined
@@ -518,7 +519,7 @@ var Button = function Button(props) {
         throw Error("Bad button props");
     }
     return null;
-};
+});
 var useButtonLinkStyles = (0, _jss).createUseStyles(function(theme) {
     var paddingY = 6;
     var paddingX = 12;
@@ -645,27 +646,30 @@ var ButtonLink = /*#__PURE__*/ React.forwardRef(function(props, ref) {
     return null;
 });
 exports.ButtonLink = ButtonLink;
-var ButtonPrimary = function ButtonPrimary(props) {
+var ButtonPrimary = /*#__PURE__*/ React.forwardRef(function(props, ref) {
     var classes = usePrimaryButtonStyles();
     return /*#__PURE__*/ (0, _jsxRuntime).jsx(Button, _objectSpread({}, props, {
+        ref: ref,
         classes: classes,
         type: "primary"
     }));
-};
+});
 exports.ButtonPrimary = ButtonPrimary;
-var ButtonSecondary = function ButtonSecondary(props) {
+var ButtonSecondary = /*#__PURE__*/ React.forwardRef(function(props, ref) {
     var classes = useSecondaryButtonStyles();
     return /*#__PURE__*/ (0, _jsxRuntime).jsx(Button, _objectSpread({}, props, {
+        ref: ref,
         classes: classes,
         type: "secondary"
     }));
-};
+});
 exports.ButtonSecondary = ButtonSecondary;
-var ButtonDanger = function ButtonDanger(props) {
+var ButtonDanger = /*#__PURE__*/ React.forwardRef(function(props, ref) {
     var classes = useDangerButtonStyles();
     return /*#__PURE__*/ (0, _jsxRuntime).jsx(Button, _objectSpread({}, props, {
+        ref: ref,
         classes: classes,
         type: "danger"
     }));
-};
+});
 exports.ButtonDanger = ButtonDanger;

package/dist/button.js.flow

@@ -1,6 +1,7 @@
 // @flow
 
 import * as React from "react";
+import type { TouchableElement } from "./touchable";
 import type {
   DataAttributes,
   RendersElement,
@@ -87,10 +88,10 @@ export type ButtonLinkProps =
   | ButtonLinkOnPressProps
   | ButtonLinkHrefProps
   | ButtonLinkToProps;
-declare export var ButtonLink: React.AbstractComponent<ButtonLinkProps, HTMLAnchorElement | HTMLDivElement | HTMLButtonElement>;
-declare export var ButtonPrimary: React.ComponentType<ButtonProps>;
-declare export var ButtonSecondary: React.ComponentType<ButtonProps>;
-declare export var ButtonDanger: React.ComponentType<ButtonProps>;
+declare export var ButtonLink: React.AbstractComponent<ButtonLinkProps, TouchableElement>;
+declare export var ButtonPrimary: React.AbstractComponent<ButtonProps, TouchableElement>;
+declare export var ButtonSecondary: React.AbstractComponent<ButtonProps, TouchableElement>;
+declare export var ButtonDanger: React.AbstractComponent<ButtonProps, TouchableElement>;
 export type ButtonElement =
   | RendersElement<typeof ButtonPrimary>
   | RendersElement<typeof ButtonSecondary>

package/dist/index.d.ts

@@ -3,6 +3,7 @@ export { default as ThemeContext } from './theme-context';
 export { default as ThemeContextProvider } from './theme-context-provider';
 export { default as ScreenReaderOnly } from './screen-reader-only';
 export { default as Touchable } from './touchable';
+export type { TouchableElement } from './touchable';
 export { default as Spinner } from './spinner';
 export { default as FadeIn } from './fade-in';
 export { ButtonPrimary, ButtonSecondary, ButtonDanger, ButtonLink } from './button';

package/dist/index.js.flow

@@ -5,6 +5,7 @@ declare export { default as ThemeContext } from "./theme-context";
 declare export { default as ThemeContextProvider } from "./theme-context-provider";
 declare export { default as ScreenReaderOnly } from "./screen-reader-only";
 declare export { default as Touchable } from "./touchable";
+export type { TouchableElement } from "./touchable";
 declare export { default as Spinner } from "./spinner";
 declare export { default as FadeIn } from "./fade-in";
 declare export {

package/dist/list.d.ts

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import type { TouchableElement } from './touchable';
 import type { DataAttributes, TrackingEvent } from './utils/types';
 interface CommonProps {
     children?: void;
@@ -107,7 +108,7 @@ interface OnPressRowContentProps extends CommonProps {
     right?: Right;
 }
 declare type RowContentProps = BasicRowContentProps | SwitchRowContentProps | RadioRowContentProps | CheckboxRowContentProps | HrefRowContentProps | ToRowContentProps | OnPressRowContentProps;
-export declare const Row: React.ForwardRefExoticComponent<RowContentProps & React.RefAttributes<HTMLAnchorElement | HTMLDivElement | HTMLButtonElement>>;
+export declare const Row: React.ForwardRefExoticComponent<RowContentProps & React.RefAttributes<TouchableElement>>;
 declare type RowListProps = {
     children: React.ReactNode;
     ariaLabelledby?: string;

package/dist/list.js.flow

@@ -1,6 +1,7 @@
 // @flow
 
 import * as React from "react";
+import type { TouchableElement } from "./touchable";
 import type { DataAttributes, TrackingEvent } from "./utils/types";
 declare type CommonProps = {
   headline?: string | React.Node,
@@ -76,7 +77,7 @@ declare type RowContentProps =
   | HrefRowContentProps
   | ToRowContentProps
   | OnPressRowContentProps;
-declare export var Row: React.AbstractComponent<RowContentProps, HTMLAnchorElement | HTMLDivElement | HTMLButtonElement>;
+declare export var Row: React.AbstractComponent<RowContentProps, TouchableElement>;
 declare type RowListProps = {
   children: React.Node,
   ariaLabelledby?: string,

package/dist/package-version.js

@@ -3,5 +3,5 @@ Object.defineProperty(exports, "__esModule", {
     value: true
 });
 exports.PACKAGE_VERSION = void 0;
-var PACKAGE_VERSION = "12.4.0";
+var PACKAGE_VERSION = "12.5.0";
 exports.PACKAGE_VERSION = PACKAGE_VERSION;

package/dist/touchable.d.ts

@@ -66,5 +66,6 @@ export interface PropsMaybeOnPress extends CommonProps {
     formId?: string;
 }
 export declare type Props = PropsHref | PropsTo | PropsOnPress | PropsMaybeHref | PropsMaybeTo | PropsMaybeOnPress;
-declare const Touchable: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLAnchorElement | HTMLDivElement | HTMLButtonElement>>;
+export declare type TouchableElement = HTMLDivElement | HTMLAnchorElement | HTMLButtonElement;
+declare const Touchable: React.ForwardRefExoticComponent<Props & React.RefAttributes<TouchableElement>>;
 export default Touchable;

package/dist/touchable.js.flow

@@ -71,7 +71,11 @@ export type Props =
   | PropsMaybeHref
   | PropsMaybeTo
   | PropsMaybeOnPress;
-declare var Touchable: React.AbstractComponent<Props, HTMLAnchorElement | HTMLDivElement | HTMLButtonElement>;
+export type TouchableElement =
+  | HTMLDivElement
+  | HTMLAnchorElement
+  | HTMLButtonElement;
+declare var Touchable: React.AbstractComponent<Props, TouchableElement>;
 declare export default typeof Touchable;
 
 import { type CssStyle } from "./__css_types__.js.flow";

package/dist-es/button.js

@@ -313,9 +313,9 @@ var renderButtonContent = function(param) {
     });
     return resultChildrenArr;
 };
-var Button = function(props) {
+var Button = /*#__PURE__*/ React.forwardRef(function(props, ref) {
     var eventFormat = useTrackingConfig().eventFormat;
-    var ref = useForm(), formStatus = ref.formStatus, formId = ref.formId;
+    var _$ref = useForm(), formStatus = _$ref.formStatus, formId = _$ref.formId;
     var isInverse = useIsInverseVariant();
     var classes = props.classes, loadingText = props.loadingText;
     var isSubmitButton = !!props.submit;
@@ -325,7 +325,7 @@ var Button = function(props) {
     // specially in iPhone). But we want the spinner to be visible during the show/hide animation.
     // * When showSpinner prop is true, state is changed immediately.
     // * When the transition ends this state is updated again if needed
-    var ref1 = _slicedToArray(React.useState(!!showSpinner), 2), shouldRenderSpinner = ref1[0], setShouldRenderSpinner = ref1[1];
+    var _$ref1 = _slicedToArray(React.useState(!!showSpinner), 2), shouldRenderSpinner = _$ref1[0], setShouldRenderSpinner = _$ref1[1];
     React.useEffect(function() {
         if (showSpinner && !shouldRenderSpinner) {
             setShouldRenderSpinner(true);
@@ -372,6 +372,7 @@ var Button = function(props) {
     var _trackingEvent;
     var _obj;
     var commonProps = {
+        ref: ref,
         className: classnames(classes.button, props.className, (_obj = {}, _defineProperty(_obj, classes.small, props.small), _defineProperty(_obj, classes.inverse, isInverse), _defineProperty(_obj, classes.light, !isInverse), _defineProperty(_obj, classes.isLoading, showSpinner), _obj)),
         style: _objectSpread({
             cursor: props.fake ? "pointer" : undefined
@@ -485,7 +486,7 @@ var Button = function(props) {
         throw Error("Bad button props");
     }
     return null;
-};
+});
 var useButtonLinkStyles = createUseStyles(function(theme) {
     var paddingY = 6;
     var paddingX = 12;
@@ -611,24 +612,27 @@ export var ButtonLink = /*#__PURE__*/ React.forwardRef(function(props, ref) {
     }
     return null;
 });
-export var ButtonPrimary = function(props) {
+export var ButtonPrimary = /*#__PURE__*/ React.forwardRef(function(props, ref) {
     var classes = usePrimaryButtonStyles();
     return /*#__PURE__*/ _jsx(Button, _objectSpread({}, props, {
+        ref: ref,
         classes: classes,
         type: "primary"
     }));
-};
-export var ButtonSecondary = function(props) {
+});
+export var ButtonSecondary = /*#__PURE__*/ React.forwardRef(function(props, ref) {
     var classes = useSecondaryButtonStyles();
     return /*#__PURE__*/ _jsx(Button, _objectSpread({}, props, {
+        ref: ref,
         classes: classes,
         type: "secondary"
     }));
-};
-export var ButtonDanger = function(props) {
+});
+export var ButtonDanger = /*#__PURE__*/ React.forwardRef(function(props, ref) {
     var classes = useDangerButtonStyles();
     return /*#__PURE__*/ _jsx(Button, _objectSpread({}, props, {
+        ref: ref,
         classes: classes,
         type: "danger"
     }));
-};
+});

package/dist-es/package-version.js

@@ -1,2 +1,2 @@
 // DO NOT EDIT THIS FILE. It's autogenerated by set-version.js
-export var PACKAGE_VERSION = "12.4.0";
+export var PACKAGE_VERSION = "12.5.0";

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@telefonica/mistica",
-    "version": "12.4.0",
+    "version": "12.5.0",
     "license": "MIT",
     "repository": {
         "type": "git",