@activecollab/components/dist/cjs/components/CompleteCheckbox/Styles.js

ActiveCollab Components

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.StyledCompleteCheckbox = void 0;
var _styledComponents = _interopRequireWildcard(require("styled-components"));
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
var burstScale = (0, _styledComponents.keyframes)(["from{transform:scale(0);}to{transform:scale(1);}"]);
var burstAnimation = (0, _styledComponents.keyframes)(["from{stroke-dashoffset:0;}to{stroke-dashoffset:8;}"]);
var StyledCompleteCheckbox = exports.StyledCompleteCheckbox = _styledComponents.default.button.withConfig({
  displayName: "Styles__StyledCompleteCheckbox",
  componentId: "sc-1801dzg-0"
})(["", " border-color:var(--color-theme-600);transition:ease 0.3s all;background-color:transparent;padding:0;svg{", " top:50%;left:50%;transform:translate(-50%,-50%);}svg path{fill:none;stroke:#32b370;stroke-width:3;transform:scale(0);}", " svg polyline{fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:0.3s;stroke-dasharray:13;stroke-dashoffset:13;stroke:#d2d2d2;", "}", " ", " ", " ", " ", ""], {
  "position": "relative",
  "height": "1.5rem",
  "width": "1.5rem",
  "cursor": "pointer",
  "borderRadius": "9999px",
  "borderWidth": "1px",
  "borderStyle": "solid"
}, {
  "pointerEvents": "none",
  "position": "absolute"
}, function (props) {
  return props.$primary && (0, _styledComponents.css)(["svg path{stroke:var(--color-primary);}"]);
}, function (props) {
  return props.$primary && (0, _styledComponents.css)(["stroke:var(--color-theme-500);"]);
}, function (props) {
  return props.$completed && (0, _styledComponents.css)(["box-shadow:inset 0 0 0 12px var(--color-primary);border-color:var(--color-primary);border-width:0px;", " &:hover{box-shadow:inset 0 0 0 12px #84cc7c;", "}svg polyline{stroke-dashoffset:0;stroke:#fff;", "}svg path{stroke-dasharray:8;stroke-dashoffset:0;transform-origin:24px 24px;}"], !props.$primary && (0, _styledComponents.css)(["", " box-shadow:inset 0 0 0 12px #84cc7c;border-color:#84cc7c;"], {
    "borderWidth": "1px",
    "borderStyle": "solid"
  }), props.$primary && (0, _styledComponents.css)(["box-shadow:inset 0 0 0 12px var(--color-primary);"]), props.$primary && (0, _styledComponents.css)(["stroke:var(--color-theme-100);"]));
}, function (props) {
  return !props.$completed && !props.$disabled && (0, _styledComponents.css)(["&:hover,&:focus-visible{border:1px solid var(--color-primary);box-shadow:inset 0 0 0 2px var(--color-primary);border-width:0px;outline:none;", " svg polyline{stroke-dashoffset:0;}}"], !props.$primary && (0, _styledComponents.css)(["border:1px solid #84cc7c;box-shadow:inset 0 0 0 2px #84cc7c;"]));
}, function (props) {
  return props.$animation && (0, _styledComponents.css)(["svg path{animation:", " 0.6s ease 0s 1 normal,", " 0.4s ease 0.2s 1 normal;}"], burstScale, burstAnimation);
}, function (props) {
  return props.$disabled && (0, _styledComponents.css)(["", " opacity:0.5;"], {
    "cursor": "default"
  });
}, function (props) {
  return !props.$checkMarkClassName && (0, _styledComponents.css)(["svg{", "}"], {
    "height": "3rem",
    "width": "3rem"
  });
});
StyledCompleteCheckbox.displayName = "StyledCompleteCheckbox";
//# sourceMappingURL=Styles.js.map