* docs(refactoring): configured eslint and typescript (#3511) * docs: configured eslint and typescript * fixed yarn.lock * docs(refactoring): migrate components directory to typescript (#3517) * docs: migrate components directory to typescript * removed vscode settings * fix following merge * docs: refactored QueryNote component (#3576) * docs: refactored first batch of theme components (#3579) * docs: refactored second batch of theme components (#3580) * added missing badge styles * fix after merge * docs(refactoring): migrated remaining component to TypeScript (#3770) * docs(refactoring): configured eslint and typescript (#3511) * docs: configured eslint and typescript * fixed yarn.lock * docs(refactoring): migrate components directory to typescript (#3517) * docs: migrate components directory to typescript * removed vscode settings * fix following merge * docs: refactored QueryNote component (#3576) * docs: refactored first batch of theme components (#3579) * docs: refactored second batch of theme components (#3580) * added missing badge styles * docs: refactoring second batch of theme components * fix after merge * refactored icons and other components * docs: refactored all components * docs(refactoring): set up and configured Tailwind Css (#3841) * docs: added tailwind config * docs: added more tailwind configurations * add includes option * added more tailwind configurations * fix to configurations * docs(refactoring): use tailwind css (#4134) * docs: added tailwind config * docs: added more tailwind configurations * add includes option * added more tailwind configurations * fix to configurations * docs(refactoring): refactored all styles to use tailwind css (#4132) * refactored Badge component to use tailwind css * refactored Bordered component to use tailwind css * updated to latest docusaurus * refactored BorderedIcon component to use tailwind css * refactored Feedback component to use tailwind css * refactored icons and footersociallinks to tailwind css * start refactoring of large card * refactored large card styling * refactored until admonitions * refactored until codeblock * refactored until Tabs * refactored Tabs (without testing * finished refactoring styles to tailwind css * upgraded to version 2.4.1 * general fixes * adjusted eslint configurations * fixed ignore files * fixes to large card * fix search styling * fix npx command * updated tabs to use isCodeTabs prop * fixed os tabs * removed os-tabs class in favor of general styling * improvements to buttons * fix for searchbar * fixed redocly download button * chore: added eslint code action (#4135) * small change in commerce modules page
56 lines
1.4 KiB
TypeScript
56 lines
1.4 KiB
TypeScript
import React from "react"
|
|
import ThemedImage from "@theme/ThemedImage"
|
|
import clsx from "clsx"
|
|
import Bordered from "../Bordered/index"
|
|
import { IconProps } from "@site/src/theme/Icon/index"
|
|
|
|
type BorderedIconProp = {
|
|
icon?: {
|
|
light: string
|
|
dark?: string
|
|
}
|
|
IconComponent?: React.FC<IconProps>
|
|
wrapperClassName?: string
|
|
iconWrapperClassName?: string
|
|
iconClassName?: string
|
|
iconColorClassName?: string
|
|
} & React.HTMLAttributes<HTMLSpanElement>
|
|
|
|
const BorderedIcon: React.FC<BorderedIconProp> = ({
|
|
icon = null,
|
|
IconComponent = null,
|
|
wrapperClassName,
|
|
iconWrapperClassName,
|
|
iconClassName,
|
|
iconColorClassName = "",
|
|
}) => {
|
|
return (
|
|
<Bordered wrapperClassName={wrapperClassName}>
|
|
<span
|
|
className={clsx(
|
|
"tw-inline-flex tw-justify-center tw-items-center tw-rounded-sm tw-p-[2px] tw-bg-medusa-bg-component dark:tw-bg-medusa-bg-component-dark",
|
|
iconWrapperClassName
|
|
)}
|
|
>
|
|
{!IconComponent && (
|
|
<ThemedImage
|
|
sources={{
|
|
light: icon.light,
|
|
dark: icon.dark || icon.light,
|
|
}}
|
|
className={clsx(iconClassName, "bordered-icon")}
|
|
/>
|
|
)}
|
|
{IconComponent && (
|
|
<IconComponent
|
|
className={clsx(iconClassName, "bordered-icon")}
|
|
iconColorClassName={iconColorClassName}
|
|
/>
|
|
)}
|
|
</span>
|
|
</Bordered>
|
|
)
|
|
}
|
|
|
|
export default BorderedIcon
|