"use strict";
Object.defineProperty(exports, "__esModule", {
    value: true
});
function _export(target, all) {
    for(var name in all)Object.defineProperty(target, name, {
        enumerable: true,
        get: Object.getOwnPropertyDescriptor(all, name).get
    });
}
_export(exports, {
    get DotBase () {
        return DotBase;
    },
    get PaginationDot () {
        return PaginationDot;
    }
});
const _styledcomponents = /*#__PURE__*/ _interop_require_default(require("styled-components"));
function _interop_require_default(obj) {
    return obj && obj.__esModule ? obj : {
        default: obj
    };
}
const DotBase = _styledcomponents.default.li.withConfig({
    displayName: "PaginationDot__DotBase",
    componentId: "sc-6fe9db1f-0"
})([
    `width:`,
    `;height:0.375rem;border-radius:1rem;background:`,
    `;transition:width 0.1s ease-in-out,background 0.3s ease-in-out;font-size:0.5rem;& + &{margin-left:0.375rem;}&:focus{outline:0 none;}`
], ({ isActive })=>isActive ? '1.75rem' : '0.375rem', ({ isActive })=>isActive ? 'var(--text-primary)' : 'var(--surface-transparent-tertiary)');
const PaginationDot = (0, _styledcomponents.default)(DotBase).withConfig({
    displayName: "PaginationDot",
    componentId: "sc-6fe9db1f-1"
})([
    `cursor:pointer;background:`,
    `;&:hover{background:var(--text-accent);}`
], ({ isActive })=>isActive ? 'var(--text-accent)' : 'var(--surface-transparent-tertiary)');
