UNPKG

@mantine/core

Version:

React components library focused on usability, accessibility and developer experience

63 lines (62 loc) 2.48 kB
"use client"; require("../../../_virtual/_rolldown/runtime.cjs"); const require_use_props = require("../../../core/MantineProvider/use-props/use-props.cjs"); const require_create_polymorphic_component = require("../../../core/factory/create-polymorphic-component.cjs"); const require_Pagination_context = require("../Pagination.context.cjs"); const require_PaginationControl = require("../PaginationControl/PaginationControl.cjs"); const require_Pagination_icons = require("../Pagination.icons.cjs"); let react_jsx_runtime = require("react/jsx-runtime"); //#region packages/@mantine/core/src/components/Pagination/PaginationEdges/PaginationEdges.tsx function createEdgeComponent({ icon, name, action, type }) { const defaultProps = { icon }; const Component = (props) => { const { icon: Icon, ...others } = require_use_props.useProps(name, defaultProps, props); const ctx = require_Pagination_context.usePaginationContext(); const disabled = type === "next" ? ctx.active === ctx.total : ctx.active === 1; return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_PaginationControl.PaginationControl, { disabled: ctx.disabled || disabled, onClick: ctx[action], withPadding: false, ...others, children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { className: "mantine-rotate-rtl", style: { width: "calc(var(--pagination-control-size) / 1.8)", height: "calc(var(--pagination-control-size) / 1.8)" } }) }); }; Component.displayName = `@mantine/core/${name}`; return require_create_polymorphic_component.polymorphic(Component); } const PaginationNext = createEdgeComponent({ icon: require_Pagination_icons.PaginationNextIcon, name: "PaginationNext", action: "onNext", type: "next" }); const PaginationPrevious = createEdgeComponent({ icon: require_Pagination_icons.PaginationPreviousIcon, name: "PaginationPrevious", action: "onPrevious", type: "previous" }); const PaginationFirst = createEdgeComponent({ icon: require_Pagination_icons.PaginationFirstIcon, name: "PaginationFirst", action: "onFirst", type: "previous" }); const PaginationLast = createEdgeComponent({ icon: require_Pagination_icons.PaginationLastIcon, name: "PaginationLast", action: "onLast", type: "next" }); //#endregion exports.PaginationFirst = PaginationFirst; exports.PaginationLast = PaginationLast; exports.PaginationNext = PaginationNext; exports.PaginationPrevious = PaginationPrevious; //# sourceMappingURL=PaginationEdges.cjs.map