import React from 'react'
import { logoPath } from '@freesewing/config'
// Used in several icons
const page =
'M19.5 14.25v-2.625a3.375 3.375 0 00-3.375-3.375h-1.5A1.125 1.125 0 0113.5 7.125v-1.5a3.375 3.375 0 00-3.375-3.375H8.25m2.25 0H5.625c-.621 0-1.125.504-1.125 1.125v17.25c0 .621.504 1.125 1.125 1.125h12.75c.621 0 1.125-.504 1.125-1.125V11.25a9 9 0 00-9-9z'
/**
* A component to wrap SVG elements as an icon.
*
* This wraps all icons we provide. The viewBox is 0 0 24 24 so this is for 24x24 icons.
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const IconWrapper = ({
className = 'tw:w-6 tw:h-6',
stroke = 2,
children = null,
fill = false,
fillOpacity = 1,
dasharray = null,
}) => (
)
/**
* An SVG icon that looks like a play triangle
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const ApplyIcon = (props) => (
)
/**
* An SVG icon that looks like a two-column layout
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const AsideIcon = (props) => (
)
/**
* An SVG icon that looks like a lab beaker
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const BeakerIcon = (props) => (
)
/**
* An SVG icon that looks like a left U-turn that we slightly rotate
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const BackIcon = (props) => (
)
/**
* An SVG icon that looks like a red X
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const BoolNoIcon = ({ size = 6 }) => (
)
/**
* An SVG icon that looks like a green checkbox
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const BoolYesIcon = ({ size = 6 }) => (
)
/**
* An SVG icon that looks like a bookmark
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const BookmarkIcon = (props) => (
)
/**
* An SVG icon that looks like a circle
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const BulletIcon = (props) => (
)
/**
* An SVG icon that looks lik a speech bubble
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const ChatIcon = (props) => (
)
/**
* An SVG icon that looks like a circle
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @param {string} [props.label = undefined] - An optional label to put inside the circle
* @returns {JSX.Element}
*/
export const CircleIcon = (props) => (
{props.label ? (
{props.label}
) : null}
)
/**
* An SVG icon that looks like a female-projecting bathing suit
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const CisFemaleIcon = (props) => (
)
/**
* An SVG icon that looks like male-projecting swim trunks
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const CisMaleIcon = (props) => (
)
/**
* An SVG icon that look like FIXME
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const CloneIcon = (props) => (
)
/**
* An SVG icon that looks like an X character
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const CloseIcon = (props) => (
)
/**
* An SVG icon that looks like coding brackets
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const CodeIcon = (props) => (
)
/**
* An SVG icon that looks like arrows pointing inwards
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const CompactIcon = (props) => (
)
/**
* An SVG icon that looks like FIXME
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const CompareIcon = (props) => (
)
/**
* An SVG icon that looks like scales of justice
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const ControlIcon = (props) => (
)
/**
* An SVG icon that looks like two rounded squares above each other with a bit of offset
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const CopyIcon = (props) => (
)
/**
* An SVG icon that looks like a page with a smiley on it
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const CoverPageIcon = (props) => (
)
/**
* An SVG icon that looks like a museum building
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const CuratedMeasurementsSetIcon = (props) => (
)
/**
* An SVG icon that looks like a coathanger
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const DesignIcon = (props) => (
)
/**
* An SVG icon that looks like a left and right pane with different level of detail
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const DetailIcon = (props) => (
)
/**
* An SVG icon that looks like a document icon
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const DocsIcon = (props) => (
)
/**
* An SVG icon that looks like a down pointing chevron
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const DownIcon = (props) => (
)
/**
* An SVG icon that looks like a cloud with an arrow pointing down from it
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const DownloadIcon = (props) => (
)
/**
* An SVG icon that looks like a pencil
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const EditIcon = (props) => (
)
/**
* An SVG icon that looks like an envelope
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const EmailIcon = (props) => (
)
/**
* An SVG icon that looks like FIXME
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const ErrorIcon = (props) => (
)
/**
* An SVG icon that looks like arrows pointing outwards
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const ExpandIcon = (props) => (
)
/**
* An SVG icon that looks like a file/sheet with an arrow pointing downwards
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const ExportIcon = (props) => (
)
/**
* An SVG icon that looks like a ! in a triangle.
*
* This is a specifically styled NoIcon, intended to be shown on an error
* background.
*
* @component
* @param {object} props - All component props
* @param {number} [props.size = 6] - The size (a valid TailwindCSS size number)
* @returns {JSX.Element}
*/
export const FailureIcon = ({ size = 6 }) => (
)
/**
* An SVG icon that looks like a funnel
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const FilterIcon = (props) => (
)
/**
* An SVG icon that looks like a fingerprint
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const FingerprintIcon = (props) => (
)
/**
* An SVG icon that looks lik an exclamation point inside a circle
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const FixmeIcon = (props) => (
)
/**
* An SVG icon that looks lik a flag
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const FlagIcon = (props) => (
)
/**
* An SVG icon that looks lik a FIXME
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const FlipIcon = (props) => (
)
/**
* An SVG icon that looks like (or is) skully
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const FreeSewingIcon = (props) => (
)
/**
* An SVG icon that looks like a gauge or speedometer
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const GaugeIcon = (props) => (
)
/**
* An SVG icon that looks like the octocat
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const GitHubIcon = (props) => (
)
/**
* An SVG icon that looks like the Google G
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const GoogleIcon = (props) => (
)
/**
* An SVG icon that looks like a box
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const GroupIcon = (props) => (
)
/**
* An SVG icon that looks like a heart
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const HeartIcon = (props) => (
)
/**
* An SVG icon that looks like a question mark in a circle
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const HelpIcon = (props) => (
)
/**
* An SVG icon that looks like a pie with a slice a bit out of it
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const IncludeIcon = (props) => (
)
/**
* An SVG icon that looks like the Instagram logo
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const InstagramIcon = (props) => (
)
/**
* An SVG icon that looks like a key
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const KeyIcon = (props) => (
)
/**
* An SVG icon that looks like a rectangle with rounded corners (like a full screen display)
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const KioskIcon = (props) => (
)
/**
* An SVG icon that looks like a left pointing chevron
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const LeftIcon = (props) => (
)
/**
* An SVG icon that looks like a chain link
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const LinkIcon = (props) => (
)
/**
* An SVG icon that looks like a bullet list
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const ListIcon = (props) => (
)
/**
* An SVG icon that looks like a padlock
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const LockIcon = (props) => (
)
/**
* An SVG icon that looks like 4 boxes spaces out
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const MarginIcon = (props) => (
)
/**
* An SVG icon that looks like the Mastodon logo
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const MastodonIcon = (props) => (
)
/**
* An SVG icon that looks like a tape measure
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const MeasurementsIcon = (props) => (
)
/**
* An SVG icon that looks like two people's heads next/behind to each other, one bigger, one smaller
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const MeasurementsSetIcon = (props) => (
)
/**
* An SVG icon that looks like 3 horizontal lines (hamburger menu)
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const MenuIcon = (props) => (
)
/**
* An SVG icon that looks like a person icon with a + sign
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const NewMeasurementsSetIcon = (props) => (
)
/**
* An SVG icon that looks like page with a + sign in it
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const NewPatternIcon = (props) => (
)
/**
* An SVG icon that looks like a newspaper
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const NewsletterIcon = (props) => (
)
/**
* An SVG icon that looks like the X character
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const NoIcon = (props) => (
)
/**
* An SVG icon that looks like a checkmark
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const OkIcon = (props) => (
)
/**
* An SVG icon that looks like sliders on a mixing panel
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const OptionsIcon = (props) => (
)
/**
* An SVG icon that looks like a page with a margin drawn around
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const PageMarginIcon = (props) => (
)
/**
* An SVG icon that looks like a portrait and landscape page stacked
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const PageOrientationIcon = (props) => (
)
/**
* An SVG icon that looks like two differently sizes pages stacked
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const PageSizeIcon = (props) => (
)
/**
* An SVG icon that looks like a grid
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const PaperlessIcon = (props) => (
)
/**
* An SVG icon that looks like a page
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const PatternIcon = (props) => (
)
/**
* An SVG icon that looks like a +
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const PlusIcon = (props) => (
)
/**
* An SVG icon that looks like a printer
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const PrintIcon = (props) => (
)
/**
* An SVG icon that looks like FIXME
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const PrivacyIcon = (props) => (
)
/**
* An SVG icon that looks like the Reddit alian
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const RedditIcon = (props) => (
)
/**
* An SVG icon that looks like FIXME
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const ReloadIcon = (props) => (
)
/**
* An SVG icon that looks like a backspace key
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const ResetIcon = (props) => (
)
/**
* An SVG icon that looks like a double rewind arrow
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const ResetAllIcon = (props) => (
)
/**
* An SVG icon that looks like a right pointing chevron
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const RightIcon = (props) => (
)
/**
* An SVG icon that looks like a rocket
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const RocketIcon = (props) => (
)
/**
* An SVG icon that looks like two arrows in a circular layout
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const RotateIcon = (props) => (
)
/**
* An SVG icon that looks like the RSS symbol
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const RssIcon = (props) => (
)
/**
* An SVG icon that looks like a cloud with a plus sign in it
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const SaveIcon = (props) => (
)
/**
* An SVG icon that looks like a cloud with a plus sign in it
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const SaveAsIcon = (props) => (
)
/**
* An SVG icon that looks like a small solid circle with a larger dashed circle around it
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const SaIcon = (props) => (
)
/**
* An SVG icon that looks like lines of varying thickness
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const ScaleIcon = (props) => (
)
/**
* An SVG icon that looks like a magnifying glass
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const SearchIcon = (props) => (
)
/**
* An SVG icon that looks like a gear/cog
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const SettingsIcon = (props) => (
)
/**
* An SVG icon that looks like a shield
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const ShieldIcon = (props) => (
)
/**
* An SVG icon that looks like a picture camera
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const ShowcaseIcon = (props) => (
)
/**
* An SVG icon that looks like an exit door
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const SignoutIcon = (props) => (
)
/**
* An SVG icon that looks like a spinning circle
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const SpinnerIcon = (props) => (
)
/**
* An SVG icon that looks like a white checkbox.
*
* This is a specifically styled OkIcon, intended to be shown on a success-colored background
*
* @component
* @param {object} props - All component props
* @param {number} [props.size = 6] - The size (a valid TailwindCSS size number)
* @returns {JSX.Element}
*/
export const SuccessIcon = ({ size = 6 }) => (
)
/**
* An SVG icon that looks like the TikTok t
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const TikTokIcon = (props) => (
)
/**
* An SVG icon that looks like a light bulb
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const TipIcon = (props) => (
)
/**
* An SVG icon that looks like a trashcan
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const TrashIcon = (props) => (
)
/**
* An SVG icon that looks like the twitch logo
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const TwitchIcon = (props) => (
)
/**
* An SVG icon that looks like a desktop screen
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const UiIcon = (props) => (
)
/**
* An SVG icon that looks like a rewind arrow, but takes text to go inside it
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const UndoIcon = (props) => (
{props.text ? (
{props.text}
) : null}
)
/**
* An SVG icon that looks like a bit of measuring tape
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const UnitsIcon = (props) => (
)
/**
* An SVG icon that looks like an up pointing chevron
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const UpIcon = (props) => (
)
/**
* An SVG icon that looks like a cloud with an arrow pointing upwards in it
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const UploadIcon = (props) => (
)
/**
* An SVG icon that looks like a person's face
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const UserIcon = (props) => (
)
/**
* An SVG icon that looks like old-timey scales
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const UxIcon = (props) => (
)
/**
* An SVG icon that looks like an ! in a triangle
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const WarningIcon = (props) => (
)
/**
* An SVG icon that looks like a wrench/spanner
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const WrenchIcon = (props) => (
)
/**
* An SVG icon that looks like a box in dashed lines
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const XrayIcon = (props) => (
)
/**
* An SVG icon that looks like a magnifying glas with a + inside
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const ZoomInIcon = (props) => (
)
/**
* An SVG icon that looks like a magnifying glas with a - inside
*
* @component
* @param {object} props - All component props
* @param {boolean} [props.className = 'tw:m-6 tw:h-6'] - The CSS classes to apply to the SVG element
* @param {number} [props.stroke = 2] - The stroke width
* @param {JSX.Element} props.children - The component childer, the inner content of the SVG tag
* @param {boolean} [props.fill = false] - Whether or not to fill the icon
* @param {number} [props.fillOpacity = 1] - The fillOpacity to apply
* @param {string} [props.dashArray = null] - An optional stroke dashArray to apply to the stroke
* @returns {JSX.Element}
*/
export const ZoomOutIcon = (props) => (
)