@gympass/yoga 7.87.1 → 7.88.0

package/cjs/Button/web/StyledButton.js

@@ -1,31 +1,160 @@
 "use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var StyledButton_exports = {};
+__export(StyledButton_exports, {
+  default: () => StyledButton_default
+});
+module.exports = __toCommonJS(StyledButton_exports);
+var import_styled_components = __toESM(require("styled-components"));
+var import_yoga_common = require("@gympass/yoga-common");
+const StyledButton = import_styled_components.default.button`
+  box-sizing: border-box;
+  text-align: center;
+  outline: none;
+  transition: all 0.2s;
+  cursor: pointer;
 
-exports.__esModule = true;
-exports["default"] = void 0;
+  ${({
+  full,
+  small,
+  inverted,
+  secondary,
+  disabled,
+  isLoading,
+  theme: {
+    yoga: {
+      baseFont,
+      components: { button }
+    }
+  }
+}) => {
+  const state = secondary ? "secondary" : "primary";
+  return `
+      display: flex;
+      align-items: center;
+      justify-content: center;
 
-var _styledComponents = _interopRequireDefault(require("styled-components"));
+      width: ${full ? "100%" : "auto"};
+      height: ${small ? button.height.small : button.height.default}px;
+      padding-left: ${small ? button.padding.small.left : button.padding.default.left}px;
+      padding-right: ${small ? button.padding.small.right : button.padding.default.right}px;
 
-var _yogaCommon = require("@gympass/yoga-common");
+      background-color: ${button.types.contained.backgroundColor[state].default};
+      border: none;
+      border-radius: ${button.border.radius}px;
+      color: ${button.types.contained.font.default.color};
 
-var _templateObject;
+      font-size: ${small ? button.font.size.small : button.font.size.default}px;
+      font-weight: ${button.font.weight};
+      font-family: ${baseFont.family};
+      letter-spacing: normal;
+      line-height: 1;
+      text-decoration: none;
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+      svg {
+        width: ${small ? button.icon.size.small : button.icon.size.default}px;
+        height: ${small ? button.icon.size.small : button.icon.size.default}px;
+        fill: ${button.types.contained.font.default.color};
+        margin-right: ${button.icon.margin.right}px;
 
-function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
+        transition: fill 0.2s;
+      }
 
-var StyledButton = _styledComponents["default"].button(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  box-sizing: border-box;\n  text-align: center;\n  outline: none;\n  transition: all 0.2s;\n  cursor: pointer;\n\n  ", "\n"])), function (_ref) {
-  var full = _ref.full,
-      small = _ref.small,
-      inverted = _ref.inverted,
-      secondary = _ref.secondary,
-      disabled = _ref.disabled,
-      isLoading = _ref.isLoading,
-      _ref$theme$yoga = _ref.theme.yoga,
-      baseFont = _ref$theme$yoga.baseFont,
-      button = _ref$theme$yoga.components.button;
-  var state = secondary ? 'secondary' : 'primary';
-  return "\n      display: flex;\n      align-items: center;\n      justify-content: center;\n\n      width: " + (full ? '100%' : 'auto') + ";\n      height: " + (small ? button.height.small : button.height["default"]) + "px;\n      padding-left: " + (small ? button.padding.small.left : button.padding["default"].left) + "px;\n      padding-right: " + (small ? button.padding.small.right : button.padding["default"].right) + "px;\n\n      background-color: " + button.types.contained.backgroundColor[state]["default"] + ";\n      border: none;\n      border-radius: " + button.border.radius + "px;\n      color: " + button.types.contained.font["default"].color + ";\n\n      font-size: " + (small ? button.font.size.small : button.font.size["default"]) + "px;\n      font-weight: " + button.font.weight + ";\n      font-family: " + baseFont.family + ";\n      letter-spacing: normal;\n      line-height: 1;\n      text-decoration: none;\n\n      svg {\n        width: " + (small ? button.icon.size.small : button.icon.size["default"]) + "px;\n        height: " + (small ? button.icon.size.small : button.icon.size["default"]) + "px;\n        fill: " + button.types.contained.font["default"].color + ";\n        margin-right: " + button.icon.margin.right + "px;\n\n        transition: fill 0.2s;\n      }\n\n      &:not([disabled]):hover, &:not([disabled]):focus {\n        box-shadow: 0 4px 8px " + (0, _yogaCommon.hexToRgb)(button.types.contained.backgroundColor[state]["default"], 0.45) + ";\n      }\n\n      &:active {\n        background-color: " + button.types.contained.backgroundColor[state].pressed + ";\n        color: " + button.types.contained.font.pressed.color + ";\n\n        svg {\n          fill: " + button.types.contained.font.pressed.color + ";\n        }\n      }\n\n      " + (disabled ? "\n      \n        background-color " + button.types.contained.backgroundColor.disabled + ";\n        color: " + button.types.contained.font.disabled.color + ";\n        pointer-events: none;\n\n        svg {\n          fill: " + button.types.contained.font.disabled.color + ";\n        }\n\n        cursor: not-allowed;\n      \n      " : '') + "\n\n      " + (inverted ? "\n        background-color: " + button.types.contained.font["default"].color + ";\n        color: " + button.types.contained.backgroundColor[state]["default"] + ";\n\n        svg {\n          fill: " + button.types.contained.backgroundColor[state]["default"] + ";\n        }\n\n        &:active {\n          background-color: " + (0, _yogaCommon.hexToRgb)(button.types.contained.font["default"].color, 0.75) + ";\n          color: " + button.types.contained.backgroundColor[state].pressed + ";\n\n          svg {\n            fill: " + button.types.contained.backgroundColor[state].pressed + ";\n          }\n        }\n\n        &:not([disabled]):hover, &:not([disabled]):focus {\n          box-shadow: 0 4px 8px " + (0, _yogaCommon.hexToRgb)(button.types.contained.font["default"].color, 0.45) + ";\n        }\n      " : '') + "\n\n      " + (isLoading ? "\n            position: relative;\n            color: transparent;\n            " : '') + "\n\n      " + (isLoading && inverted || isLoading && disabled ? "\n          svg {\n            fill: transparent;\n          }\n            " : '') + "\n    ";
-});
+      &:not([disabled]):hover, &:not([disabled]):focus {
+        box-shadow: 0 4px 8px ${(0, import_yoga_common.hexToRgb)(
+    button.types.contained.backgroundColor[state].default,
+    0.45
+  )};
+      }
+
+      &:active {
+        background-color: ${button.types.contained.backgroundColor[state].pressed};
+        color: ${button.types.contained.font.pressed.color};
+
+        svg {
+          fill: ${button.types.contained.font.pressed.color};
+        }
+      }
+
+      ${disabled ? `
+      
+        background-color ${button.types.contained.backgroundColor.disabled};
+        color: ${button.types.contained.font.disabled.color};
+        pointer-events: none;
+
+        svg {
+          fill: ${button.types.contained.font.disabled.color};
+        }
+
+        cursor: not-allowed;
+      
+      ` : ""}
+
+      ${inverted ? `
+        background-color: ${button.types.contained.font.default.color};
+        color: ${button.types.contained.backgroundColor[state].default};
+
+        svg {
+          fill: ${button.types.contained.backgroundColor[state].default};
+        }
+
+        &:active {
+          background-color: ${(0, import_yoga_common.hexToRgb)(
+    button.types.contained.font.default.color,
+    0.75
+  )};
+          color: ${button.types.contained.backgroundColor[state].pressed};
+
+          svg {
+            fill: ${button.types.contained.backgroundColor[state].pressed};
+          }
+        }
+
+        &:not([disabled]):hover, &:not([disabled]):focus {
+          box-shadow: 0 4px 8px ${(0, import_yoga_common.hexToRgb)(
+    button.types.contained.font.default.color,
+    0.45
+  )};
+        }
+      ` : ""}
+
+      ${isLoading ? `
+            position: relative;
+            color: transparent;
+            ` : ""}
 
-var _default = StyledButton;
-exports["default"] = _default;
+      ${isLoading && inverted || isLoading && disabled ? `
+          svg {
+            fill: transparent;
+          }
+            ` : ""}
+    `;
+}}
+`;
+var StyledButton_default = StyledButton;

package/cjs/Button/web/Text.js

@@ -1,62 +1,165 @@
 "use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __getProtoOf = Object.getPrototypeOf;
+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;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var Text_exports = {};
+__export(Text_exports, {
+  default: () => Text_default
+});
+module.exports = __toCommonJS(Text_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = __toESM(require("react"));
+var import_styled_components = __toESM(require("styled-components"));
+var import_yoga_common = require("@gympass/yoga-common");
+var import_prop_types = require("prop-types");
+var import_Button = __toESM(require("./Button"));
+const StyledButton = (0, import_styled_components.default)(import_Button.default)`
+  ${({
+  secondary,
+  inverted,
+  theme: {
+    yoga: {
+      colors,
+      components: { button }
+    }
+  }
+}) => {
+  const state = secondary ? "secondary" : "primary";
+  return `
+      background-color: ${button.types.text.backgroundColor};
+      border-color: ${button.types.text.backgroundColor};
+      color: ${colors[state]};
 
-exports.__esModule = true;
-exports["default"] = void 0;
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _styledComponents = _interopRequireDefault(require("styled-components"));
-
-var _yogaCommon = require("@gympass/yoga-common");
-
-var _propTypes = require("prop-types");
-
-var _Button = _interopRequireDefault(require("./Button"));
+      svg {
+        fill: ${colors[state]};
+      }
 
-var _templateObject;
+      &:not([disabled]):hover, &:not([disabled]):focus, &:not([disabled]):active {
+        background-color: ${button.types.text.backgroundColor};
+        box-shadow: none;
+      }
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+      &:not([disabled]):hover {
+        color: ${(0, import_yoga_common.hexToRgb)(colors[state], 0.5)};
+        svg {
+          fill: ${(0, import_yoga_common.hexToRgb)(colors[state], 0.5)};
+        }
+      }
 
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+      &:not([disabled]):focus, &:not([disabled]):active {
+        color: ${(0, import_yoga_common.hexToRgb)(colors[state], 0.75)};
+        svg {
+          fill: ${(0, import_yoga_common.hexToRgb)(colors[state], 0.75)};
+        }
+      }
 
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+      ${inverted ? `
+          color: ${colors.white};
+          svg {
+            fill: ${colors.white};
+          }
 
-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); }
+          &:not([disabled]):hover {
+            color: ${(0, import_yoga_common.hexToRgb)(colors.white, 0.5)};
+            svg {
+              fill: ${(0, import_yoga_common.hexToRgb)(colors.white, 0.5)};
+            }
+          }
 
-function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
+          &:not([disabled]):focus, &:not([disabled]):active {
+            color: ${(0, import_yoga_common.hexToRgb)(colors.white, 0.75)};
+            svg {
+              fill: ${(0, import_yoga_common.hexToRgb)(colors.white, 0.75)};
+            }
+          }
+        ` : ""}
 
-var StyledButton = (0, _styledComponents["default"])(_Button["default"])(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  ", "\n"])), function (_ref) {
-  var secondary = _ref.secondary,
-      inverted = _ref.inverted,
-      _ref$theme$yoga = _ref.theme.yoga,
-      colors = _ref$theme$yoga.colors,
-      button = _ref$theme$yoga.components.button;
-  var state = secondary ? 'secondary' : 'primary';
-  return "\n      background-color: " + button.types.text.backgroundColor + ";\n      border-color: " + button.types.text.backgroundColor + ";\n      color: " + colors[state] + ";\n\n      svg {\n        fill: " + colors[state] + ";\n      }\n\n      &:not([disabled]):hover, &:not([disabled]):focus, &:not([disabled]):active {\n        background-color: " + button.types.text.backgroundColor + ";\n        box-shadow: none;\n      }\n\n      &:not([disabled]):hover {\n        color: " + (0, _yogaCommon.hexToRgb)(colors[state], 0.5) + ";\n        svg {\n          fill: " + (0, _yogaCommon.hexToRgb)(colors[state], 0.5) + ";\n        }\n      }\n\n      &:not([disabled]):focus, &:not([disabled]):active {\n        color: " + (0, _yogaCommon.hexToRgb)(colors[state], 0.75) + ";\n        svg {\n          fill: " + (0, _yogaCommon.hexToRgb)(colors[state], 0.75) + ";\n        }\n      }\n\n      " + (inverted ? "\n          color: " + colors.white + ";\n          svg {\n            fill: " + colors.white + ";\n          }\n\n          &:not([disabled]):hover {\n            color: " + (0, _yogaCommon.hexToRgb)(colors.white, 0.5) + ";\n            svg {\n              fill: " + (0, _yogaCommon.hexToRgb)(colors.white, 0.5) + ";\n            }\n          }\n\n          &:not([disabled]):focus, &:not([disabled]):active {\n            color: " + (0, _yogaCommon.hexToRgb)(colors.white, 0.75) + ";\n            svg {\n              fill: " + (0, _yogaCommon.hexToRgb)(colors.white, 0.75) + ";\n            }\n          }\n        " : '') + "\n\n      &:disabled {\n        background-color: " + button.types.text.backgroundColor + ";\n        border-color: " + button.types.text.backgroundColor + ";\n        color: " + button.types.text.disabled + ";\n        svg {\n          fill: " + button.types.text.disabled + ";\n        }\n      }\n    ";
-});
-var ButtonText = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
-  var rest = _extends({}, _ref2);
-
-  var props = Object.fromEntries(Object.entries(rest).filter(function (_ref3) {
-    var key = _ref3[0];
-    return key !== 'isLoading';
-  }));
-  var secondary = props.secondary,
-      inverted = props.inverted;
-  return /*#__PURE__*/_react["default"].createElement(StyledButton, _extends({}, props, {
-    secondary: secondary,
-    inverted: inverted,
-    ref: ref
-  }));
+      &:disabled {
+        background-color: ${button.types.text.backgroundColor};
+        border-color: ${button.types.text.backgroundColor};
+        color: ${button.types.text.disabled};
+        svg {
+          fill: ${button.types.text.disabled};
+        }
+      }
+    `;
+}}
+`;
+const ButtonText = (0, import_react.forwardRef)((_a, ref) => {
+  var rest = __objRest(_a, []);
+  const props = Object.fromEntries(
+    Object.entries(rest).filter(([key]) => key !== "isLoading")
+  );
+  const { secondary, inverted } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    StyledButton,
+    __spreadProps(__spreadValues({}, props), {
+      secondary,
+      inverted,
+      ref
+    })
+  );
 });
 ButtonText.propTypes = {
-  inverted: _propTypes.bool,
-  secondary: _propTypes.bool
+  inverted: import_prop_types.bool,
+  secondary: import_prop_types.bool
 };
 ButtonText.defaultProps = {
   inverted: false,
   secondary: false
 };
-ButtonText.displayName = 'Button.Text';
-var _default = ButtonText;
-exports["default"] = _default;
+ButtonText.displayName = "Button.Text";
+var Text_default = ButtonText;

package/cjs/Card/native/Card/Actions.js

@@ -1 +1,41 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _taggedTemplateLiteralLoose2=_interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _styledComponents=_interopRequireDefault(require("styled-components"));var _propTypes=require("prop-types");var _templateObject;var Actions=_styledComponents["default"].View(_templateObject||(_templateObject=(0,_taggedTemplateLiteralLoose2["default"])([""])));Actions.propTypes={children:_propTypes.node.isRequired};Actions.displayName='Card.Actions';var _default=Actions;exports["default"]=_default;
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var Actions_exports = {};
+__export(Actions_exports, {
+  default: () => Actions_default
+});
+module.exports = __toCommonJS(Actions_exports);
+var import_styled_components = __toESM(require("styled-components"));
+var import_prop_types = require("prop-types");
+const Actions = import_styled_components.default.View``;
+Actions.propTypes = {
+  children: import_prop_types.node.isRequired
+};
+Actions.displayName = "Card.Actions";
+var Actions_default = Actions;

package/cjs/Card/native/Card/Card.js

@@ -1 +1,209 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _taggedTemplateLiteralLoose2=_interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _react=_interopRequireDefault(require("react"));var _styledComponents=_interopRequireDefault(require("styled-components"));var _propTypes=require("prop-types");var _Text=_interopRequireDefault(require("../../../Text"));var _Box=_interopRequireDefault(require("../../../Box"));var _excluded=["ribbon","children"];var _templateObject,_templateObject2,_templateObject3,_templateObject4;var CardShadow=(0,_styledComponents["default"])(_Box["default"]).attrs(function(_ref){var elevation=_ref.theme.yoga.components.card.elevation;return{elevation:elevation};})(_templateObject||(_templateObject=(0,_taggedTemplateLiteralLoose2["default"])([""])));var CardStyled=(0,_styledComponents["default"])(_Box["default"]).attrs(function(_ref2){var variant=_ref2.variant,_ref2$theme$yoga=_ref2.theme.yoga,color=_ref2$theme$yoga.colors[variant],card=_ref2$theme$yoga.components.card;return{elevation:card.elevation,pt:card.padding.top,pr:card.padding.right,pb:card.padding.bottom,pl:card.padding.left,bRadius:card.radii,bgColor:variant?color:card.backgroundColor,overflow:'hidden'};})(_templateObject2||(_templateObject2=(0,_taggedTemplateLiteralLoose2["default"])([""])));var Ribbon=_styledComponents["default"].View(_templateObject3||(_templateObject3=(0,_taggedTemplateLiteralLoose2["default"])(["\n  ","\n"])),function(_ref3){var variant=_ref3.variant,_ref3$theme$yoga=_ref3.theme.yoga,card=_ref3$theme$yoga.components.card,spacing=_ref3$theme$yoga.spacing,_ref3$theme$yoga$colo=_ref3$theme$yoga.colors,elements=_ref3$theme$yoga$colo.elements,color=_ref3$theme$yoga$colo[variant],white=_ref3$theme$yoga$colo.white,dark=_ref3$theme$yoga$colo.dark;return"\n    align-self: flex-start;\n\n    margin-bottom: "+card.padding.bottom+"px;\n    margin-left: -"+card.padding.left+"px;\n\n    padding:\n      "+spacing.xxxsmall+"px\n      "+spacing.xsmall+"px\n      "+spacing.xxxsmall+"px\n      "+spacing.small+"px;\n\n    border-top-right-radius: "+card.ribbon.radius+"px;\n    border-bottom-right-radius: "+card.ribbon.radius+"px;\n    background-color: "+(variant?color:elements.backgroundAndDisabled)+";\n\n    color: "+(variant?white:dark)+";\n  ";});var RibbonText=(0,_styledComponents["default"])(_Text["default"].Tiny)(_templateObject4||(_templateObject4=(0,_taggedTemplateLiteralLoose2["default"])(["\n  ","\n"])),function(_ref4){var variant=_ref4.variant,_ref4$theme$yoga$colo=_ref4.theme.yoga.colors,white=_ref4$theme$yoga$colo.white,dark=_ref4$theme$yoga$colo.dark;return"\n    color: "+(variant?white:dark)+";\n  ";});var Card=_react["default"].forwardRef(function(_ref5,ref){var ribbon=_ref5.ribbon,children=_ref5.children,rest=(0,_objectWithoutProperties2["default"])(_ref5,_excluded);return _react["default"].createElement(CardShadow,null,_react["default"].createElement(CardStyled,(0,_extends2["default"])({ref:ref},rest),Object.keys(ribbon).length>0&&_react["default"].createElement(Ribbon,{variant:ribbon.variant},_react["default"].createElement(RibbonText,{variant:ribbon.variant},ribbon.text)),children));});Card.propTypes={ribbon:(0,_propTypes.shape)({text:_propTypes.string,variant:(0,_propTypes.oneOf)(['','primary','secondary','vibin','hope','energy','relax','peace','verve','uplift','deepPurple','stamina','dark','medium','deep','light','clear','white'])}),children:_propTypes.node,variant:(0,_propTypes.oneOf)(['','primary','secondary','vibin','hope','energy','relax','peace','verve','uplift','deepPurple','stamina','dark','medium','deep','light','clear','white'])};Card.defaultProps={ribbon:{},children:null,variant:''};Card.displayName='Card';var _default=Card;exports["default"]=_default;
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __getProtoOf = Object.getPrototypeOf;
+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;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var Card_exports = {};
+__export(Card_exports, {
+  default: () => Card_default
+});
+module.exports = __toCommonJS(Card_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = __toESM(require("react"));
+var import_styled_components = __toESM(require("styled-components"));
+var import_prop_types = require("prop-types");
+var import_Text = __toESM(require("../../../Text"));
+var import_Box = __toESM(require("../../../Box"));
+const CardShadow = (0, import_styled_components.default)(import_Box.default).attrs(
+  ({
+    theme: {
+      yoga: {
+        components: {
+          card: { elevation }
+        }
+      }
+    }
+  }) => ({
+    elevation
+  })
+)``;
+const CardStyled = (0, import_styled_components.default)(import_Box.default).attrs(
+  ({
+    variant,
+    theme: {
+      yoga: {
+        colors: { [variant]: color },
+        components: { card }
+      }
+    }
+  }) => ({
+    elevation: card.elevation,
+    pt: card.padding.top,
+    pr: card.padding.right,
+    pb: card.padding.bottom,
+    pl: card.padding.left,
+    bRadius: card.radii,
+    bgColor: variant ? color : card.backgroundColor,
+    overflow: "hidden"
+  })
+)``;
+const Ribbon = import_styled_components.default.View`
+  ${({
+  variant,
+  theme: {
+    yoga: {
+      components: { card },
+      spacing,
+      colors: { elements, [variant]: color, white, dark }
+    }
+  }
+}) => `
+    align-self: flex-start;
+
+    margin-bottom: ${card.padding.bottom}px;
+    margin-left: -${card.padding.left}px;
+
+    padding:
+      ${spacing.xxxsmall}px
+      ${spacing.xsmall}px
+      ${spacing.xxxsmall}px
+      ${spacing.small}px;
+
+    border-top-right-radius: ${card.ribbon.radius}px;
+    border-bottom-right-radius: ${card.ribbon.radius}px;
+    background-color: ${variant ? color : elements.backgroundAndDisabled};
+
+    color: ${variant ? white : dark};
+  `}
+`;
+const RibbonText = (0, import_styled_components.default)(import_Text.default.Tiny)`
+  ${({
+  variant,
+  theme: {
+    yoga: {
+      colors: { white, dark }
+    }
+  }
+}) => `
+    color: ${variant ? white : dark};
+  `}
+`;
+const Card = import_react.default.forwardRef((_a, ref) => {
+  var _b = _a, { ribbon, children } = _b, rest = __objRest(_b, ["ribbon", "children"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardShadow, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(CardStyled, __spreadProps(__spreadValues({ ref }, rest), { children: [
+    Object.keys(ribbon).length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Ribbon, { variant: ribbon.variant, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(RibbonText, { variant: ribbon.variant, children: ribbon.text }) }),
+    children
+  ] })) });
+});
+Card.propTypes = {
+  /** text: the content inside the Card Ribbon
+   * variant: style the card following the theme (primary, secondary, vibin,
+   * hope, energy, relax, peace, verve, uplift, deepPurple, deep, stamina, dark,
+   * medium, light, clear, white) */
+  ribbon: (0, import_prop_types.shape)({
+    text: import_prop_types.string,
+    variant: (0, import_prop_types.oneOf)([
+      "",
+      "primary",
+      "secondary",
+      "vibin",
+      "hope",
+      "energy",
+      "relax",
+      "peace",
+      "verve",
+      "uplift",
+      "deepPurple",
+      "stamina",
+      "dark",
+      "medium",
+      "deep",
+      "light",
+      "clear",
+      "white"
+    ])
+  }),
+  children: import_prop_types.node,
+  /** style the card following the theme (primary, secondary, vibin, hope,
+   * energy, relax, peace, verve, uplift, deepPurple, deep, stamina, dark,
+   * medium, light, clear, white) */
+  variant: (0, import_prop_types.oneOf)([
+    "",
+    "primary",
+    "secondary",
+    "vibin",
+    "hope",
+    "energy",
+    "relax",
+    "peace",
+    "verve",
+    "uplift",
+    "deepPurple",
+    "stamina",
+    "dark",
+    "medium",
+    "deep",
+    "light",
+    "clear",
+    "white"
+  ])
+};
+Card.defaultProps = {
+  ribbon: {},
+  children: null,
+  variant: ""
+};
+Card.displayName = "Card";
+var Card_default = Card;