();\n\n return (\n \n \n
\n );\n};\n\nDomainSearchForm.displayName = 'SearchForm';\n\nexport default DomainSearchForm;\n","import React, { ComponentType } from 'react';\nimport errorBoundary from 'presentation/hocs/errorBoundary';\nimport visibilitySet from 'presentation/hocs/visibilitySet';\nimport Shortcode, { ShortcodeProps } from 'components/Shortcode';\nimport { Container } from '@uds/grid';\nimport { IconName } from '@uds/glyphs';\nimport { Heading04 } from '@uds/typography';\nimport { useTheme } from '@uds/theme-utils';\nimport { RibbonProps, Type } from 'domain/constants/ribbons';\nimport { isNotNilNorEmpty } from 'presentation/utils/generalUtils';\n\nimport DomainSearchForm from '../domain-search-start/DomainSearchForm';\nimport useStylesheet, { getClassNames } from './DomainSearchStartStrip.stylesheet';\nimport Ribbon from '../Ribbon';\n\nexport interface OuterProps extends RibbonProps {\n text: {\n title?: ShortcodeProps;\n };\n search: {\n tld: string;\n glyph: IconName;\n label: string;\n placeholder?: string;\n destination?: string;\n };\n}\n\nconst DomainSearchStartStrip = ({ id, loading, colorway, layout, hBaseline, name, text, search }: OuterProps) => {\n const { title } = text;\n const { theme } = useTheme();\n const { styles } = useStylesheet({\n theme,\n });\n const hasTitle = isNotNilNorEmpty(title);\n const classNames = getClassNames();\n return (\n \n \n \n {hasTitle && (\n
\n \n \n )}\n
\n \n
\n
\n \n \n );\n};\n\nexport default errorBoundary(visibilitySet(DomainSearchStartStrip)) as ComponentType;\n","import { useStyles } from '@team-griffin/stylr';\nimport cssSides, { Side } from '@team-griffin/css-sides';\nimport { useBreakpoints } from '@uds/responsive';\nimport { css } from 'linaria';\nimport { gu2px, Theme, cssTheme } from '@uds/theme-utils';\n\nconst title = css`\n text-align: center;\n margin-bottom: ${cssTheme.gu3};\n &&& {\n ${cssTheme.breakpoints.lg} {\n white-space: no-wrap;\n margin: 0 calc(${cssTheme.gu1} * 1.5);\n }\n }\n`;\n\nexport const getClassNames = () => {\n return {\n title,\n };\n};\nexport default ({ theme }: { theme: Theme }) => {\n const { isMinMd, isMinLg } = useBreakpoints();\n\n const { spacing } = theme;\n\n return useStyles(\n {\n default: {\n content: {\n ...cssSides('padding', Side.A, gu2px(3, spacing)),\n justifyContent: 'center',\n display: 'flex',\n flexDirection: 'column',\n },\n },\n isMinMd: {\n content: {\n alignItems: 'center',\n },\n search: {\n flex: 1,\n flexBasis: 'auto', // IE 11 fix\n minWidth: `${(100 / 12) * 8}%`,\n ...cssSides('margin', Side.X, 'auto'),\n },\n },\n isMinLg: {\n content: {\n // 2.5 + 1.5 = 4GU padding to implement padding-box rules\n ...cssSides('padding', Side.X, gu2px(2.5, spacing)),\n ...cssSides('padding', Side.Y, gu2px(2.5, spacing)),\n flexDirection: 'row',\n justifyContent: 'center',\n alignItems: 'center',\n flexWrap: 'wrap',\n },\n search: {\n ...cssSides('margin', Side.A, gu2px(1.5, spacing)),\n flex: 1,\n // min-width is 4 col\n minWidth: `${(100 / 12) * 4}%`,\n maxWidth: '50%',\n },\n },\n },\n [{ isMinMd }, { isMinLg }],\n );\n};\n","import DomainSearchStartStrip from './DomainSearchStartStrip';\n\nexport default DomainSearchStartStrip;\n"],"sourceRoot":""}