UNPKG

@mantine/core

Version:

React components library focused on usability, accessibility and developer experience

mantine.dev

mantinedev/mantine

1 lines • 4 kB
1
{"version":3,"file":"ComboboxChevron.mjs","names":["classes"],"sources":["../../../../src/components/Combobox/ComboboxChevron/ComboboxChevron.tsx"],"sourcesContent":["import {\n Box,\n BoxProps,\n createVarsResolver,\n ElementProps,\n Factory,\n factory,\n getSize,\n getThemeColor,\n MantineColor,\n MantineSize,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../../core';\nimport classes from '../Combobox.module.css';\n\nexport type ComboboxChevronStylesNames = 'chevron';\nexport type ComboboxChevronCSSVariables = {\n chevron: '--combobox-chevron-size' | '--combobox-chevron-color';\n};\n\nexport interface ComboboxChevronProps\n extends\n BoxProps,\n StylesApiProps<ComboboxChevronFactory>,\n ElementProps<'svg', 'opacity' | 'display'> {\n size?: MantineSize | (string & {});\n error?: React.ReactNode;\n color?: MantineColor;\n}\n\nexport type ComboboxChevronFactory = Factory<{\n props: ComboboxChevronProps;\n ref: SVGSVGElement;\n stylesNames: ComboboxChevronStylesNames;\n vars: ComboboxChevronCSSVariables;\n}>;\n\nconst defaultProps = {\n error: null,\n} satisfies Partial<ComboboxChevronProps>;\n\nconst varsResolver = createVarsResolver<ComboboxChevronFactory>((theme, { size, color }) => ({\n chevron: {\n '--combobox-chevron-size': getSize(size, 'combobox-chevron-size'),\n '--combobox-chevron-color': color ? getThemeColor(color, theme) : undefined,\n },\n}));\n\nexport const ComboboxChevron = factory<ComboboxChevronFactory>((_props) => {\n const props = useProps('ComboboxChevron', defaultProps, _props);\n const {\n size,\n error,\n style,\n className,\n classNames,\n styles,\n unstyled,\n vars,\n attributes,\n mod,\n ...others\n } = props;\n\n const getStyles = useStyles<ComboboxChevronFactory>({\n name: 'ComboboxChevron',\n classes,\n props,\n style,\n className,\n classNames,\n styles,\n unstyled,\n vars,\n varsResolver,\n attributes,\n rootSelector: 'chevron',\n });\n\n return (\n <Box\n component=\"svg\"\n {...others}\n {...getStyles('chevron')}\n size={size}\n viewBox=\"0 0 15 15\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n mod={['combobox-chevron', { error }, mod]}\n >\n <path\n d=\"M4.93179 5.43179C4.75605 5.60753 4.75605 5.89245 4.93179 6.06819C5.10753 6.24392 5.39245 6.24392 5.56819 6.06819L7.49999 4.13638L9.43179 6.06819C9.60753 6.24392 9.89245 6.24392 10.0682 6.06819C10.2439 5.89245 10.2439 5.60753 10.0682 5.43179L7.81819 3.18179C7.73379 3.0974 7.61933 3.04999 7.49999 3.04999C7.38064 3.04999 7.26618 3.0974 7.18179 3.18179L4.93179 5.43179ZM10.0682 9.56819C10.2439 9.39245 10.2439 9.10753 10.0682 8.93179C9.89245 8.75606 9.60753 8.75606 9.43179 8.93179L7.49999 10.8636L5.56819 8.93179C5.39245 8.75606 5.10753 8.75606 4.93179 8.93179C4.75605 9.10753 4.75605 9.39245 4.93179 9.56819L7.18179 11.8182C7.35753 11.9939 7.64245 11.9939 7.81819 11.8182L10.0682 9.56819Z\"\n fill=\"currentColor\"\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n />\n </Box>\n );\n});\n\nComboboxChevron.classes = classes;\nComboboxChevron.varsResolver = varsResolver;\nComboboxChevron.displayName = '@mantine/core/ComboboxChevron';\n"],"mappings":";;;;;;;;;;;AAuCA,MAAM,eAAe,EACnB,OAAO,MACR;AAED,MAAM,eAAe,oBAA4C,OAAO,EAAE,MAAM,aAAa,EAC3F,SAAS;CACP,2BAA2B,QAAQ,MAAM,wBAAwB;CACjE,4BAA4B,QAAQ,cAAc,OAAO,MAAM,GAAG,KAAA;CACnE,EACF,EAAE;AAEH,MAAa,kBAAkB,SAAiC,WAAW;CACzE,MAAM,QAAQ,SAAS,mBAAmB,cAAc,OAAO;CAC/D,MAAM,EACJ,MACA,OACA,OACA,WACA,YACA,QACA,UACA,MACA,YACA,KACA,GAAG,WACD;CAEJ,MAAM,YAAY,UAAkC;EAClD,MAAM;EACN,SAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cAAc;EACf,CAAC;AAEF,QACE,oBAAC,KAAD;EACE,WAAU;EACV,GAAI;EACJ,GAAI,UAAU,UAAU;EAClB;EACN,SAAQ;EACR,MAAK;EACL,OAAM;EACN,KAAK;GAAC;GAAoB,EAAE,OAAO;GAAE;GAAI;YAEzC,oBAAC,QAAD;GACE,GAAE;GACF,MAAK;GACL,UAAS;GACT,UAAS;GACT,CAAA;EACE,CAAA;EAER;AAEF,gBAAgB,UAAUA;AAC1B,gBAAgB,eAAe;AAC/B,gBAAgB,cAAc"}