UNPKG

@mantine/core

Version:

React components library focused on usability, accessibility and developer experience

1 lines 3.91 kB
{"version":3,"file":"Affix.cjs","names":["getDefaultZIndex","createVarsResolver","getSpacing","factory","useProps","useStyles","OptionalPortal","Box","classes"],"sources":["../../../src/components/Affix/Affix.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n factory,\n Factory,\n getDefaultZIndex,\n getSpacing,\n MantineSize,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { BasePortalProps, OptionalPortal } from '../Portal';\nimport classes from './Affix.module.css';\n\nexport type AffixStylesNames = 'root';\nexport type AffixCssVariables = {\n root: '--affix-z-index' | '--affix-top' | '--affix-left' | '--affix-bottom' | '--affix-right';\n};\n\nexport interface AffixPosition {\n top?: MantineSize | (string & {}) | number;\n left?: MantineSize | (string & {}) | number;\n bottom?: MantineSize | (string & {}) | number;\n right?: MantineSize | (string & {}) | number;\n}\n\nexport interface AffixBaseProps {\n /** Root element `z-index` property @default 200 */\n zIndex?: React.CSSProperties['zIndex'];\n\n /** Determines whether the component is rendered within `Portal` @default true */\n withinPortal?: boolean;\n\n /** Props passed down to the `Portal` component. Ignored when `withinPortal` is `false`. */\n portalProps?: BasePortalProps;\n\n /** Affix position on screen @default { bottom: 0, right: 0 } */\n position?: AffixPosition;\n}\n\nexport interface AffixProps\n extends BoxProps, AffixBaseProps, StylesApiProps<AffixFactory>, ElementProps<'div'> {}\n\nexport type AffixFactory = Factory<{\n props: AffixProps;\n ref: HTMLDivElement;\n stylesNames: AffixStylesNames;\n vars: AffixCssVariables;\n}>;\n\nconst defaultProps = {\n position: { bottom: 0, right: 0 },\n zIndex: getDefaultZIndex('modal'),\n withinPortal: true,\n} satisfies Partial<AffixProps>;\n\nconst varsResolver = createVarsResolver<AffixFactory>((_, { zIndex, position }) => ({\n root: {\n '--affix-z-index': zIndex?.toString(),\n '--affix-top': getSpacing(position?.top),\n '--affix-left': getSpacing(position?.left),\n '--affix-bottom': getSpacing(position?.bottom),\n '--affix-right': getSpacing(position?.right),\n },\n}));\n\nexport const Affix = factory<AffixFactory>((_props) => {\n const props = useProps('Affix', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n portalProps,\n zIndex,\n withinPortal,\n position,\n attributes,\n ...others\n } = props;\n\n const getStyles = useStyles<AffixFactory>({\n name: 'Affix',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n attributes,\n vars,\n varsResolver,\n });\n\n return (\n <OptionalPortal {...portalProps} withinPortal={withinPortal}>\n <Box {...getStyles('root')} {...others} />\n </OptionalPortal>\n );\n});\n\nAffix.classes = classes;\nAffix.varsResolver = varsResolver;\nAffix.displayName = '@mantine/core/Affix';\n"],"mappings":";;;;;;;;;;;;;AAqDA,MAAM,eAAe;CACnB,UAAU;EAAE,QAAQ;EAAG,OAAO;EAAG;CACjC,QAAQA,4BAAAA,iBAAiB,QAAQ;CACjC,cAAc;CACf;AAED,MAAM,eAAeC,6BAAAA,oBAAkC,GAAG,EAAE,QAAQ,gBAAgB,EAClF,MAAM;CACJ,mBAAmB,QAAQ,UAAU;CACrC,eAAeC,iBAAAA,WAAW,UAAU,IAAI;CACxC,gBAAgBA,iBAAAA,WAAW,UAAU,KAAK;CAC1C,kBAAkBA,iBAAAA,WAAW,UAAU,OAAO;CAC9C,iBAAiBA,iBAAAA,WAAW,UAAU,MAAM;CAC7C,EACF,EAAE;AAEH,MAAa,QAAQC,gBAAAA,SAAuB,WAAW;CACrD,MAAM,QAAQC,kBAAAA,SAAS,SAAS,cAAc,OAAO;CACrD,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,aACA,QACA,cACA,UACA,YACA,GAAG,WACD;CAEJ,MAAM,YAAYC,mBAAAA,UAAwB;EACxC,MAAM;EACN,SAAA,qBAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,QACE,iBAAA,GAAA,kBAAA,KAACC,uBAAAA,gBAAD;EAAgB,GAAI;EAA2B;YAC7C,iBAAA,GAAA,kBAAA,KAACC,YAAAA,KAAD;GAAK,GAAI,UAAU,OAAO;GAAE,GAAI;GAAU,CAAA;EAC3B,CAAA;EAEnB;AAEF,MAAM,UAAUC,qBAAAA;AAChB,MAAM,eAAe;AACrB,MAAM,cAAc"}