@gympass/yoga 7.87.1 → 7.88.1

package/esm/Slider/native/Tooltip.js

@@ -1,90 +1,177 @@
-var _excluded = ["children"],
-    _excluded2 = ["title", "description", "ribbon"];
-
-var _templateObject, _templateObject2;
-
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
-function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
-
-import React from 'react';
-import { string, node } from 'prop-types';
-import styled from 'styled-components';
-import Text from '../../Text';
-import Box from '../../Box';
-var Wrapper = styled(Box).attrs(function (_ref) {
-  var slider = _ref.theme.yoga.components.slider;
-  return {
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+import { jsx, jsxs } from "react/jsx-runtime";
+import React from "react";
+import { string, node } from "prop-types";
+import styled from "styled-components";
+import Text from "../../Text";
+import Box from "../../Box";
+const Wrapper = styled(Box).attrs(
+  ({
+    theme: {
+      yoga: {
+        components: { slider }
+      }
+    }
+  }) => ({
     bgColor: slider.tooltip.ribbon.backgroundColor,
     bottom: 38,
     bRadius: slider.tooltip.radius,
     elevation: slider.tooltip.shadow,
-    position: 'absolute',
+    position: "absolute",
     width: 95
-  };
-})(_templateObject || (_templateObject = _taggedTemplateLiteralLoose([""])));
-var Tip = styled.View(function (_ref2) {
-  var slider = _ref2.theme.yoga.components.slider;
-  return "\n    background-color: " + slider.tooltip.backgroundColor + ";\n    border-radius: " + slider.tooltip.radius + "px;\n    padding: " + slider.tooltip.padding.top + "px " + slider.tooltip.padding.right + "px " + slider.tooltip.padding.bottom + "px " + slider.tooltip.padding.left + "px;\n    justify-content: center;\n    width: 95px;\n  ";
-});
-var Title = styled(Text.Small)(function (_ref3) {
-  var slider = _ref3.theme.yoga.components.slider;
-  return "\n    color: " + slider.tooltip.font.color + ";\n    margin-bottom: 5px;\n    text-align: center;\n  ";
-});
-var Description = styled(Text.Small)(function (_ref4) {
-  var slider = _ref4.theme.yoga.components.slider;
-  return "\n    color: " + slider.tooltip.font.color + ";\n    text-align: center;\n  ";
-});
-var Arrow = styled(Box).attrs(function (_ref5) {
-  var slider = _ref5.theme.yoga.components.slider;
-  return {
-    alignSelf: 'center',
-    bottom: '10px',
-    bRadius: '3px',
+  })
+)``;
+const Tip = styled.View(
+  ({
+    theme: {
+      yoga: {
+        components: { slider }
+      }
+    }
+  }) => `
+    background-color: ${slider.tooltip.backgroundColor};
+    border-radius: ${slider.tooltip.radius}px;
+    padding: ${slider.tooltip.padding.top}px ${slider.tooltip.padding.right}px ${slider.tooltip.padding.bottom}px ${slider.tooltip.padding.left}px;
+    justify-content: center;
+    width: 95px;
+  `
+);
+const Title = styled(Text.Small)(
+  ({
+    theme: {
+      yoga: {
+        components: { slider }
+      }
+    }
+  }) => `
+    color: ${slider.tooltip.font.color};
+    margin-bottom: 5px;
+    text-align: center;
+  `
+);
+const Description = styled(Text.Small)(
+  ({
+    theme: {
+      yoga: {
+        components: { slider }
+      }
+    }
+  }) => `
+    color: ${slider.tooltip.font.color};
+    text-align: center;
+  `
+);
+const Arrow = styled(Box).attrs(
+  ({
+    theme: {
+      yoga: {
+        components: { slider }
+      }
+    }
+  }) => ({
+    alignSelf: "center",
+    bottom: "10px",
+    bRadius: "3px",
     bgColor: slider.tooltip.backgroundColor,
     height: 16,
     width: 16,
     mb: -17,
-    position: 'absolute'
-  };
-})(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n  transform: rotate(45deg);\n"])));
-var RibbonWrapper = styled.View(function (_ref6) {
-  var slider = _ref6.theme.yoga.components.slider;
-  return "\n    align-items: center;\n    background-color: " + slider.tooltip.ribbon.backgroundColor + ";\n    border-top-left-radius: " + slider.tooltip.ribbon.radius + "px;\n    border-top-right-radius: " + slider.tooltip.ribbon.radius + "px;\n    justify-content: center;\n    padding: " + slider.tooltip.ribbon.padding.top + "px " + slider.tooltip.ribbon.padding.right + "px " + slider.tooltip.ribbon.padding.bottom + "px " + slider.tooltip.ribbon.padding.left + "px;\n    position: relative;\n  ";
-});
-var RibbonText = styled(Text.Bold)(function (_ref7) {
-  var slider = _ref7.theme.yoga.components.slider;
-  return "\n    color: " + slider.tooltip.ribbon.font.color + ";\n\n    font-size: " + slider.tooltip.ribbon.font.size + "px;\n\n    text-align: center;\n  ";
-});
+    position: "absolute"
+  })
+)`
+  transform: rotate(45deg);
+`;
+const RibbonWrapper = styled.View(
+  ({
+    theme: {
+      yoga: {
+        components: { slider }
+      }
+    }
+  }) => `
+    align-items: center;
+    background-color: ${slider.tooltip.ribbon.backgroundColor};
+    border-top-left-radius: ${slider.tooltip.ribbon.radius}px;
+    border-top-right-radius: ${slider.tooltip.ribbon.radius}px;
+    justify-content: center;
+    padding: ${slider.tooltip.ribbon.padding.top}px ${slider.tooltip.ribbon.padding.right}px ${slider.tooltip.ribbon.padding.bottom}px ${slider.tooltip.ribbon.padding.left}px;
+    position: relative;
+  `
+);
+const RibbonText = styled(Text.Bold)(
+  ({
+    theme: {
+      yoga: {
+        components: { slider }
+      }
+    }
+  }) => `
+    color: ${slider.tooltip.ribbon.font.color};
 
-var Ribbon = function Ribbon(_ref8) {
-  var children = _ref8.children,
-      props = _objectWithoutPropertiesLoose(_ref8, _excluded);
+    font-size: ${slider.tooltip.ribbon.font.size}px;
 
-  return /*#__PURE__*/React.createElement(RibbonWrapper, props, /*#__PURE__*/React.createElement(RibbonText, null, children));
+    text-align: center;
+  `
+);
+const Ribbon = (_a) => {
+  var _b = _a, { children } = _b, props = __objRest(_b, ["children"]);
+  return /* @__PURE__ */ jsx(RibbonWrapper, __spreadProps(__spreadValues({}, props), { children: /* @__PURE__ */ jsx(RibbonText, { children }) }));
 };
-
 Ribbon.propTypes = {
   children: node.isRequired
 };
-
-var Tooltip = function Tooltip(_ref9) {
-  var title = _ref9.title,
-      description = _ref9.description,
-      ribbon = _ref9.ribbon,
-      props = _objectWithoutPropertiesLoose(_ref9, _excluded2);
-
-  return /*#__PURE__*/React.createElement(Wrapper, null, /*#__PURE__*/React.createElement(Arrow, null), ribbon && /*#__PURE__*/React.createElement(Ribbon, null, ribbon), (title || description) && /*#__PURE__*/React.createElement(Tip, props, title && /*#__PURE__*/React.createElement(Title, null, title), description && /*#__PURE__*/React.createElement(Description, null, description)));
+const Tooltip = (_c) => {
+  var _d = _c, { title, description, ribbon } = _d, props = __objRest(_d, ["title", "description", "ribbon"]);
+  return /* @__PURE__ */ jsxs(Wrapper, { children: [
+    /* @__PURE__ */ jsx(Arrow, {}),
+    ribbon && /* @__PURE__ */ jsx(Ribbon, { children: ribbon }),
+    (title || description) && /* @__PURE__ */ jsxs(Tip, __spreadProps(__spreadValues({}, props), { children: [
+      title && /* @__PURE__ */ jsx(Title, { children: title }),
+      description && /* @__PURE__ */ jsx(Description, { children: description })
+    ] }))
+  ] });
 };
-
 Tooltip.propTypes = {
   title: string,
   description: string,
   ribbon: string
 };
 Tooltip.defaultProps = {
-  title: undefined,
-  description: undefined,
-  ribbon: undefined
+  title: void 0,
+  description: void 0,
+  ribbon: void 0
+};
+var Tooltip_default = Tooltip;
+export {
+  Tooltip_default as default
 };
-export default Tooltip;

package/esm/Slider/web/Marker.js

@@ -1,72 +1,100 @@
-var _excluded = ["values", "dragging", "index", "tooltip"];
-
-var _templateObject;
-
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
-function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
-
-import React from 'react';
-import { arrayOf, number, shape, bool, string } from 'prop-types';
-import { hexToRgb } from '@gympass/yoga-common';
-import styled from 'styled-components';
-import RCHandle from 'rc-slider/lib/Handle';
-import Tooltip from './Tooltip';
-var Circle = styled(RCHandle)(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  cursor: pointer;\n  height: 24px;\n  margin-top: -10px;\n  outline: none;\n  position: absolute;\n  top: 0;\n  width: 24px;\n  ", "\n"])), function (_ref) {
-  var dataDragging = _ref['data-dragging'],
-      slider = _ref.theme.yoga.components.slider;
-  return "\n    background-color: " + slider.marker.backgroundColor + ";\n    border: 6px solid " + slider.marker.border.color + ";\n    border-radius: " + slider.marker.border.radius + "px;\n    box-shadow: " + (dataDragging ? slider.marker.shadow + ",\n          0 0 0 8px " + hexToRgb(slider.marker.backgroundColor, 0.2) : slider.marker.shadow) + ";\n  ";
-});
-
-var Marker = function Marker(_ref2) {
-  var values = _ref2.values,
-      dragging = _ref2.dragging,
-      index = _ref2.index,
-      tooltip = _ref2.tooltip,
-      props = _objectWithoutPropertiesLoose(_ref2, _excluded);
-
-  var renderTooltip = function renderTooltip() {
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+import { jsx } from "react/jsx-runtime";
+import React from "react";
+import { arrayOf, number, shape, bool, string } from "prop-types";
+import { hexToRgb } from "@gympass/yoga-common";
+import styled from "styled-components";
+import RCHandle from "rc-slider/lib/Handle";
+import Tooltip from "./Tooltip";
+const Circle = styled(RCHandle)`
+  cursor: pointer;
+  height: 24px;
+  margin-top: -10px;
+  outline: none;
+  position: absolute;
+  top: 0;
+  width: 24px;
+  ${({
+  "data-dragging": dataDragging,
+  theme: {
+    yoga: {
+      components: { slider }
+    }
+  }
+}) => `
+    background-color: ${slider.marker.backgroundColor};
+    border: 6px solid ${slider.marker.border.color};
+    border-radius: ${slider.marker.border.radius}px;
+    box-shadow: ${dataDragging ? `${slider.marker.shadow},
+          0 0 0 8px ${hexToRgb(slider.marker.backgroundColor, 0.2)}` : slider.marker.shadow};
+  `}
+`;
+const Marker = (_a) => {
+  var _b = _a, { values, dragging, index, tooltip } = _b, props = __objRest(_b, ["values", "dragging", "index", "tooltip"]);
+  const renderTooltip = () => {
     if (!dragging) {
       return false;
     }
-
-    return tooltip.filter(function (_ref3) {
-      var step = _ref3.step,
-          visible = _ref3.visible;
-
+    return tooltip.filter(({ step, visible }) => {
       if (!step && step !== 0) {
         return visible;
       }
-
       return visible && values[index] === step;
     })[0];
   };
-
-  return /*#__PURE__*/React.createElement(Circle, _extends({
-    "data-dragging": Boolean(dragging)
-  }, props), dragging && /*#__PURE__*/React.createElement(Tooltip, {
-    data: renderTooltip()
-  }));
+  return /* @__PURE__ */ jsx(Circle, __spreadProps(__spreadValues({ "data-dragging": Boolean(dragging) }, props), { children: dragging && /* @__PURE__ */ jsx(Tooltip, { data: renderTooltip() }) }));
 };
-
 Marker.propTypes = {
   values: arrayOf(number),
   dragging: bool,
   index: number,
-  tooltip: arrayOf(shape({
-    ribbon: string,
-    title: string,
-    description: string,
-    visible: bool,
-    step: number
-  }))
+  tooltip: arrayOf(
+    shape({
+      ribbon: string,
+      title: string,
+      description: string,
+      visible: bool,
+      step: number
+    })
+  )
 };
 Marker.defaultProps = {
   values: [0],
   dragging: false,
   index: 0,
-  tooltip: undefined
+  tooltip: void 0
+};
+var Marker_default = Marker;
+export {
+  Marker_default as default
 };
-export default Marker;