@navinc/base-react-components/cjs/chevron.js

Nav's Pattern Library

"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.Chevron = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const styled_components_1 = __importDefault(require("styled-components"));
const carrot_left_js_1 = __importDefault(require("./icons/actions/carrot-left.js"));
const prop_types_1 = __importDefault(require("prop-types"));
const is_rebrand_js_1 = __importDefault(require("./is-rebrand.js"));
const setColor = ({ isInvalid, disabled, theme }) => {
    if ((0, is_rebrand_js_1.default)(theme)) {
        if (isInvalid)
            return theme.navStatusNegative;
        return disabled ? theme.navNeutral400 : theme.navPrimary;
    }
    if (isInvalid)
        return theme.error;
    return disabled ? theme.scuttleGray500 : theme.azure;
};
const ChevronWrapper = styled_components_1.default.div.withConfig({ displayName: "brc-sc-ChevronWrapper", componentId: "brc-sc-yupxyd" }) `
  pointer-events: none;
`;
const StyledChevron = (0, styled_components_1.default)(carrot_left_js_1.default).withConfig({ displayName: "brc-sc-StyledChevron", componentId: "brc-sc-15j0i7d" }) `
  fill: ${({ isInvalid, disabled, theme }) => setColor({ isInvalid, disabled, theme })};
  transform: ${({ $isOpen }) => `rotate(${$isOpen ? '0turn' : '-0.25turn'})}`};
  transition: 'transform 0.2s ease-in-out',
  transitionDelay: '0.1s',
  willChange: 'transform',
`;
ChevronWrapper.displayName = 'ChevronWrapper';
/**
 *
 * @param {*} props You can not access props directly. | optional | {}
 * @property {string} className
 * @property {boolean} disabled
 * @property {boolean} isInvalid
 * @property {boolean} $isOpen
 * @returns React.ReactElement
 */
const Chevron = ({ className, disabled, isInvalid, $isOpen }) => ((0, jsx_runtime_1.jsx)(ChevronWrapper, Object.assign({ className: className }, { children: (0, jsx_runtime_1.jsx)(StyledChevron, { "$isOpen": $isOpen, disabled: disabled, isInvalid: isInvalid }) })));
exports.Chevron = Chevron;
exports.Chevron.propTypes = {
    className: prop_types_1.default.string,
    disabled: prop_types_1.default.bool,
    isInvalid: prop_types_1.default.bool,
    /** Shares the isOpen state with styled-components, but does not pass down to the child as a prop */
    $isOpen: prop_types_1.default.bool,
};
exports.Chevron.defaultProps = {
    disabled: false,
    isInvalid: false,
    $isOpen: false,
};
exports.Chevron.displayName = 'Chevron';
exports.default = (0, styled_components_1.default)(exports.Chevron).withConfig({ componentId: "brc-sc-1dui8iq" }) ``;
//# sourceMappingURL=chevron.js.map