UNPKG

@activecollab/components

Version:

ActiveCollab Components

56 lines (55 loc) 2.18 kB
import _extends from "@babel/runtime/helpers/esm/extends"; import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose"; const _excluded = ["gradient"]; import React from "react"; import { GradientDefs } from "../../GradientDefs"; /** * @component DollarOffIcon * @description * * The React Icon component is a visual element that displays an icon to represent a concept, object, or action. * The Icon component is * customizable, allowing for variations in size, color, and style to fit the needs of the application. * * @prop {string} [gradient] - Optional CSS linear-gradient string to apply a custom fill. * Format: "linear-gradient(<angle>deg, <color1>, <color2>, ...)" * * @example * return ( * <DollarOffIcon gradient="linear-gradient(135deg, #4da2ed, #f72222)" /> * ) * * @example * return ( * <DollarOffIcon className="mr-2" /> * ) * * @see * https://system.activecollab.com/?path=/story/foundation-icons-icons--icons * @see * https://design.activecollab.com/docs/foundations/icons */ const DollarOffIcon = /*#__PURE__*/React.forwardRef((_ref, svgRef) => { let { gradient } = _ref, props = _objectWithoutPropertiesLoose(_ref, _excluded); return /*#__PURE__*/React.createElement("svg", _extends({ width: 24, height: 24, viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", "data-testid": "DollarOffIcon", fill: gradient ? "url(#icon-gradient)" : props != null && props.fill ? props.fill : "var(--color-theme-600)", focusable: false, ref: svgRef }, props), /*#__PURE__*/React.createElement(GradientDefs, { gradient: gradient }), /*#__PURE__*/React.createElement("path", { d: "M3 4.27L4.28 3 21 19.72 19.73 21l-3.67-3.67c-.62.67-1.52 1.22-2.56 1.49V21h-3v-2.18C8.47 18.31 7 16.79 7 15h2c0 1.08 1.37 2 3 2 1.13 0 2.14-.44 2.65-1.08l-2.97-2.97C9.58 12.42 7 11.75 7 9c0-.23 0-.45.07-.66L3 4.27m7.5.91V3h3v2.18C15.53 5.69 17 7.21 17 9h-2c0-1.08-1.37-2-3-2-.37 0-.72.05-1.05.13L9.4 5.58l1.1-.4z", fillRule: "evenodd" })); }); DollarOffIcon.displayName = "DollarOffIcon"; export default DollarOffIcon; //# sourceMappingURL=DollarOff.js.map