@helsenorge/designsystem-react 13.7.0 → 13.9.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/CHANGELOG.md +32 -0
- package/lib/Checkbox.js +1 -1
- package/lib/Checkbox.js.map +1 -1
- package/lib/DoctorSmall.js +22 -35
- package/lib/DoctorSmall.js.map +1 -1
- package/lib/Drawer.js +2 -1
- package/lib/Drawer.js.map +1 -1
- package/lib/HelpTriggerIcon.js +121 -43
- package/lib/HelpTriggerIcon.js.map +1 -1
- package/lib/IllustrationNames.js +6 -2
- package/lib/IllustrationNames.js.map +1 -1
- package/lib/Label.js +27 -23
- package/lib/Label.js.map +1 -1
- package/lib/LazyIllustration.js +5 -1
- package/lib/LazyIllustration.js.map +1 -1
- package/lib/RadioButton.js +1 -1
- package/lib/RadioButton.js.map +1 -1
- package/lib/StorkMedium.js +96 -0
- package/lib/StorkMedium.js.map +1 -0
- package/lib/ThinkingMedium.js +98 -0
- package/lib/ThinkingMedium.js.map +1 -0
- package/lib/components/Button/styles.module.scss +1 -3
- package/lib/components/Checkbox/styles.module.scss +4 -0
- package/lib/components/Checkbox/styles.module.scss.d.ts +1 -0
- package/lib/components/Drawer/styles.module.scss +4 -21
- package/lib/components/Drawer/styles.module.scss.d.ts +1 -1
- package/lib/components/ExpanderHierarchy/Expander.d.ts +2 -0
- package/lib/components/ExpanderHierarchy/ExpanderHierarchy.d.ts +1 -1
- package/lib/components/ExpanderHierarchy/index.js +2 -1
- package/lib/components/ExpanderHierarchy/index.js.map +1 -1
- package/lib/components/HelpTriggerIcon/HelpSign.d.ts +2 -2
- package/lib/components/HelpTriggerInline/styles.module.scss +1 -0
- package/lib/components/Illustrations/IllustrationNames.d.ts +1 -1
- package/lib/components/Illustrations/Stork.d.ts +11 -0
- package/lib/components/Illustrations/Stork.js +16 -0
- package/lib/components/Illustrations/Stork.js.map +1 -0
- package/lib/components/Illustrations/StorkMedium.d.ts +4 -0
- package/lib/components/Illustrations/StorkMedium.js +2 -0
- package/lib/components/Illustrations/Thinking.d.ts +9 -0
- package/lib/components/Illustrations/Thinking.js +16 -0
- package/lib/components/Illustrations/Thinking.js.map +1 -0
- package/lib/components/Illustrations/ThinkingMedium.d.ts +4 -0
- package/lib/components/Illustrations/ThinkingMedium.js +2 -0
- package/lib/components/Label/Label.d.ts +3 -1
- package/lib/components/Label/styles.module.scss +1 -1
- package/lib/components/RadioButton/styles.module.scss +4 -0
- package/lib/components/RadioButton/styles.module.scss.d.ts +1 -0
- package/lib/components/ServiceMessage/ServiceMessage.d.ts +3 -1
- package/lib/components/ServiceMessage/index.js +3 -3
- package/lib/components/ServiceMessage/index.js.map +1 -1
- package/lib/components/StickyNote/Triangle.d.ts +0 -1
- package/lib/components/StickyNote/index.js +8 -5
- package/lib/components/StickyNote/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HelpTriggerIcon.js","names":["HelpSign: React.FC<HelpSignProps>"],"sources":["../src/components/HelpTriggerIcon/HelpSign.tsx","../src/components/HelpTriggerIcon/HelpTriggerIcon.tsx","../src/components/HelpTriggerIcon/index.ts"],"sourcesContent":["import React from 'react';\n\nimport { HelpTriggerWeights } from '../HelpTriggerIcon';\n\nexport interface HelpSignProps {\n color?: string;\n weight?: HelpTriggerWeights;\n}\n\nconst HelpSign: React.FC<HelpSignProps> = ({ color, weight }: HelpSignProps): React.ReactElement => {\n const paths =\n weight === 'normal' ? (\n <>\n <defs>\n <clipPath id=\"clipCircle\" clipPathUnits=\"userSpaceOnUse\">\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M10.0004 0C4.48644 0 0 4.48565 0 9.99961C0 15.5136 4.48644 20 10.0004 20C15.5144 20 20 15.5136 20 9.99961C20 4.48565 15.5144 0 10.0004 0\"\n />\n </clipPath>\n </defs>\n <path\n d=\"M10.0004 0V-2C3.38207 -2 -2 3.38088 -2 9.99961H0H2C2 5.59043 5.5908 2 10.0004 2V0ZM0 9.99961H-2C-2 16.6181 3.38187 22 10.0004 22V20V18C5.59101 18 2 14.409 2 9.99961H0ZM10.0004 20V22C16.6191 22 22 16.6179 22 9.99961H20H18C18 14.4092 14.4096 18 10.0004 18V20ZM20 9.99961H22C22 3.38108 16.6189 -2 10.0004 -2V0V2C14.4098 2 18 5.59022 18 9.99961H20Z\"\n fill={color}\n clipPath=\"url(#clipCircle)\"\n />\n <path\n d=\"M9.93555 4.40039C12.1061 4.40039 13.2998 5.8386 13.2998 7.35156C13.2997 8.52045 12.2922 9.61789 11.8262 9.94238C11.3601 10.2669 11.209 10.5 11.209 10.5C11.0283 10.6756 10.9117 11.0195 10.8721 11.2715C10.8316 11.5286 10.8476 11.5136 10.8477 11.7998V11.9004H9.20117V11.2715C9.20117 10.8463 9.20556 10.7433 9.31934 10.374C9.43483 9.99921 9.75195 9.54492 10.0928 9.18262C10.4336 8.82031 10.751 8.58105 10.751 8.58105C11.1983 8.25659 11.3818 7.87361 11.3818 7.42285C11.3818 7.07417 11.2638 6.74031 11.0283 6.49414C10.794 6.24916 10.435 6.08301 9.93555 6.08301C8.94209 6.08316 8.41811 6.83977 8.41797 7.60742C8.41797 7.81763 8.44731 8.07481 8.49805 8.21582L8.5498 8.36035L6.7793 8.23535L6.70898 8.23047L6.69043 8.16309C6.63105 7.95321 6.60059 7.71544 6.60059 7.47949C6.60081 6.00363 7.71413 4.40053 9.93555 4.40039Z\"\n fill={color}\n />\n <path\n d=\"M10 12.7998C10.6024 12.7999 11.0996 13.31 11.0996 13.9072C11.0994 14.506 10.6023 14.9999 10 15C9.38173 15 8.8996 14.506 8.89941 13.9072C8.89941 13.31 9.38162 12.7998 10 12.7998Z\"\n fill={color}\n />\n </>\n ) : (\n <>\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M10.0004 0C4.48644 0 0 4.48565 0 9.99961C0 15.5136 4.48644 20 10.0004 20C15.5144 20 20 15.5136 20 9.99961C20 4.48565 15.5144 0 10.0004 0Z\"\n />\n <path\n d=\"M9.93555 4.40039C12.1061 4.40039 13.2998 5.8386 13.2998 7.35156C13.2997 8.52045 12.2922 9.61789 11.8262 9.94238C11.3601 10.2669 11.209 10.5 11.209 10.5C11.0283 10.6756 10.9117 11.0195 10.8721 11.2715C10.8316 11.5286 10.8476 11.5136 10.8477 11.7998V11.9004H9.20117V11.2715C9.20117 10.8463 9.20556 10.7433 9.31934 10.374C9.43483 9.99921 9.75195 9.54492 10.0928 9.18262C10.4336 8.82031 10.751 8.58105 10.751 8.58105C11.1983 8.25659 11.3818 7.87361 11.3818 7.42285C11.3818 7.07417 11.2638 6.74031 11.0283 6.49414C10.794 6.24916 10.435 6.08301 9.93555 6.08301C8.94209 6.08316 8.41811 6.83977 8.41797 7.60742C8.41797 7.81763 8.44731 8.07481 8.49805 8.21582L8.5498 8.36035L6.7793 8.23535L6.70898 8.23047L6.69043 8.16309C6.63105 7.95321 6.60059 7.71544 6.60059 7.47949C6.60081 6.00363 7.71413 4.40053 9.93555 4.40039Z\"\n fill=\"white\"\n />\n <path\n d=\"M10 12.7998C10.6024 12.7999 11.0996 13.31 11.0996 13.9072C11.0994 14.506 10.6023 14.9999 10 15C9.38173 15 8.8996 14.506 8.89941 13.9072C8.89941 13.31 9.38162 12.7998 10 12.7998Z\"\n fill=\"white\"\n />\n </>\n );\n\n return (\n <svg fill=\"none\" height=\"20\" overflow=\"visible\" role={'presentation'} width=\"20\" viewBox=\"0 0 20 20\" xmlns=\"http://www.w3.org/2000/svg\">\n {paths}\n </svg>\n );\n};\n\nexport default HelpSign;\n","import React from 'react';\n\nimport classNames from 'classnames';\n\nimport HelpSign from './HelpSign';\nimport { AnalyticsId } from '../../constants';\nimport { usePseudoClasses } from '../../hooks/usePseudoClasses';\nimport { getAriaLabelAttributes } from '../../utils/accessibility';\nimport { mergeRefs } from '../../utils/refs';\n\nimport styles from './styles.module.scss';\n\nexport type HelpTriggerIconSizes = 'inherit' | 'medium' | 'large' | 'xlarge';\n\nexport type HelpTriggerIconTags = 'button' | 'span';\n\nexport type HelpTriggerWeights = 'normal' | 'strong';\n\nexport interface HelpTriggerIconProps extends Pick<\n React.InputHTMLAttributes<HTMLButtonElement>,\n 'onClick' | 'aria-haspopup' | 'aria-controls' | 'aria-expanded'\n> {\n /**\n * Sets aria-label of the trigger. ariaLabel or ariaLabelledById MUST be set!\n */\n ariaLabel?: string;\n /**\n * Sets aria-labelledby of the trigger. ariaLabel or ariaLabelledById MUST be set!\n */\n ariaLabelledById?: string;\n /** Adds custom classes to the element. */\n className?: string;\n /**\n * Size of the Icon. Default: medium.\n */\n size?: HelpTriggerIconSizes;\n /** Sets the data-testid attribute. */\n testId?: string;\n /**\n * Sets the colors of the help trigger icon. Default: normal.\n */\n weight?: HelpTriggerWeights;\n}\n\ninterface HelpTriggerIconInternalProps extends HelpTriggerIconProps {\n /**\n * Sets the hover styling of the trigger. Intended for use when wrapped by a parent button.\n */\n isHovered?: boolean;\n /**\n * Only use this if the parent wrapper is a Button!\n * Changes the underlying element of the trigger. If set to span, the trigger will be a non-interactive icon. Default: button\n */\n htmlMarkup?: HelpTriggerIconTags;\n}\n\nconst getIconColor = (hover: boolean, weight: HelpTriggerWeights): string | undefined => {\n if (weight === 'normal') {\n return hover ? 'var(--color-help-graphics-verydark)' : 'var(--color-help-graphics-normal)';\n }\n};\n\nconst HelpTriggerIcon = React.forwardRef<HTMLButtonElement, HelpTriggerIconProps>((props, ref) => {\n return <HelpTriggerIconInternal {...props} ref={ref} />;\n});\n\nexport const HelpTriggerIconInternal = React.forwardRef<HTMLButtonElement, HelpTriggerIconInternalProps>(\n (\n {\n ariaLabel,\n ariaLabelledById,\n className,\n htmlMarkup = 'button',\n isHovered = false,\n size = 'medium',\n testId,\n weight = 'normal',\n ...buttonRest\n },\n ref\n ) => {\n const ariaLabelAttributes = getAriaLabelAttributes({ label: ariaLabel, id: ariaLabelledById });\n const { refObject, isHovered: interalIsHovered } = usePseudoClasses<HTMLButtonElement>(ref as React.RefObject<HTMLButtonElement>);\n const helpIcon = <HelpSign color={getIconColor(interalIsHovered || isHovered, weight)} weight={weight} />;\n const isButton = htmlMarkup === 'button';\n const iconClasses = classNames(\n styles['help-trigger-icon'],\n {\n [styles['help-trigger-icon--strong']]: weight === 'strong',\n [styles['help-trigger-icon--is-button']]: isButton,\n },\n styles[`help-trigger-icon--${size}`],\n className\n );\n\n if (isButton) {\n return (\n <button\n {...ariaLabelAttributes}\n type=\"button\"\n data-testid={testId}\n data-analyticsid={AnalyticsId.HelpTriggerIcon}\n className={iconClasses}\n ref={mergeRefs([refObject, ref])}\n {...buttonRest}\n >\n {helpIcon}\n </button>\n );\n }\n\n return (\n <span data-testid={testId} data-analyticsid={AnalyticsId.HelpTriggerIcon} className={iconClasses}>\n {helpIcon}\n </span>\n );\n }\n);\n\nHelpTriggerIcon.displayName = 'HelpTriggerIcon';\nHelpTriggerIconInternal.displayName = 'HelpTriggerIconInternal';\n\nexport default HelpTriggerIcon;\n","import HelpTriggerIcon from './HelpTriggerIcon';\nexport * from './HelpTriggerIcon';\nexport default HelpTriggerIcon;\n"],"mappings":";;;;;;;;AASA,IAAMA,YAAqC,EAAE,OAAO,aAAgD;AA6ClG,QACE,oBAAC,OAAA;EAAI,MAAK;EAAO,QAAO;EAAK,UAAS;EAAU,MAAM;EAAgB,OAAM;EAAK,SAAQ;EAAY,OAAM;YA5C3G,WAAW,WACT,qBAAA,UAAA,EAAA,UAAA;GACE,oBAAC,QAAA,EAAA,UACC,oBAAC,YAAA;IAAS,IAAG;IAAa,eAAc;cACtC,oBAAC,QAAA;KACC,UAAS;KACT,UAAS;KACT,GAAE;MACF;KACO,EAAA,CACN;GACP,oBAAC,QAAA;IACC,GAAE;IACF,MAAM;IACN,UAAS;KACT;GACF,oBAAC,QAAA;IACC,GAAE;IACF,MAAM;KACN;GACF,oBAAC,QAAA;IACC,GAAE;IACF,MAAM;KACN;MACD,GAEH,qBAAA,UAAA,EAAA,UAAA;GACE,oBAAC,QAAA;IACC,UAAS;IACT,UAAS;IACT,GAAE;KACF;GACF,oBAAC,QAAA;IACC,GAAE;IACF,MAAK;KACL;GACF,oBAAC,QAAA;IACC,GAAE;IACF,MAAK;KACL;MACD;GAMC;;AAIV,IAAA,mBAAe;ACLf,IAAM,gBAAgB,OAAgB,WAAmD;AACvF,KAAI,WAAW,SACb,QAAO,QAAQ,wCAAwC;;AAI3D,IAAM,kBAAkB,MAAM,YAAqD,OAAO,QAAQ;AAChG,QAAO,oBAAC,yBAAA;EAAwB,GAAI;EAAY;GAAO;EACvD;AAEF,MAAa,0BAA0B,MAAM,YAEzC,EACE,WACA,kBACA,WACA,aAAa,UACb,YAAY,OACZ,OAAO,UACP,QACA,SAAS,UACT,GAAG,cAEL,QACG;CACH,MAAM,sBAAsB,uBAAuB;EAAE,OAAO;EAAW,IAAI;EAAkB,CAAC;CAC9F,MAAM,EAAE,WAAW,WAAW,qBAAqB,iBAAoC,IAA0C;CACjI,MAAM,WAAW,oBAAC,kBAAA;EAAS,OAAO,aAAa,oBAAoB,WAAW,OAAO;EAAU;GAAU;CACzG,MAAM,WAAW,eAAe;CAChC,MAAM,cAAc,WAClB,OAAO,sBACP;GACG,OAAO,+BAA+B,WAAW;GACjD,OAAO,kCAAkC;EAC3C,EACD,OAAO,sBAAsB,SAC7B,UACD;AAED,KAAI,SACF,QACE,oBAAC,UAAA;EACC,GAAI;EACJ,MAAK;EACL,eAAa;EACb,oBAAkB,YAAY;EAC9B,WAAW;EACX,KAAK,UAAU,CAAC,WAAW,IAAI,CAAC;EAChC,GAAI;YAEH;GACM;AAIb,QACE,oBAAC,QAAA;EAAK,eAAa;EAAQ,oBAAkB,YAAY;EAAiB,WAAW;YAClF;GACI;EAGZ;AAED,gBAAgB,cAAc;AAC9B,wBAAwB,cAAc;ACtHtC,IAAA,4BDwHe"}
|
|
1
|
+
{"version":3,"file":"HelpTriggerIcon.js","names":["HelpSign: React.FC<HelpSignProps>"],"sources":["../src/components/HelpTriggerIcon/HelpSign.tsx","../src/components/HelpTriggerIcon/HelpTriggerIcon.tsx","../src/components/HelpTriggerIcon/index.ts"],"sourcesContent":["import { useId } from 'react';\n\nimport type { HelpTriggerWeights, HelpTriggerIconSizes } from '../HelpTriggerIcon';\n\nimport { useIsMobileBreakpoint } from '../../hooks/useIsMobileBreakpoint';\n\nexport interface HelpSignProps {\n color?: string;\n weight?: HelpTriggerWeights;\n size?: HelpTriggerIconSizes;\n}\n\nconst HelpSign: React.FC<HelpSignProps> = ({ color, weight, size }: HelpSignProps): React.ReactElement => {\n const isMobile = useIsMobileBreakpoint();\n const uniqueId = useId();\n const maskIdNormal = `${uniqueId}-mask-normal`;\n const maskIdMobile = `${uniqueId}-mask-mobile`;\n\n const normalSizeNormalWeight = (\n <>\n <defs>\n <clipPath id={uniqueId} clipPathUnits=\"userSpaceOnUse\">\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M10.0004 0C4.48644 0 0 4.48565 0 9.99961C0 15.5136 4.48644 20 10.0004 20C15.5144 20 20 15.5136 20 9.99961C20 4.48565 15.5144 0 10.0004 0\"\n />\n </clipPath>\n </defs>\n <path\n d=\"M10.0004 0V-2C3.38207 -2 -2 3.38088 -2 9.99961H0H2C2 5.59043 5.5908 2 10.0004 2V0ZM0 9.99961H-2C-2 16.6181 3.38187 22 10.0004 22V20V18C5.59101 18 2 14.409 2 9.99961H0ZM10.0004 20V22C16.6191 22 22 16.6179 22 9.99961H20H18C18 14.4092 14.4096 18 10.0004 18V20ZM20 9.99961H22C22 3.38108 16.6189 -2 10.0004 -2V0V2C14.4098 2 18 5.59022 18 9.99961H20Z\"\n fill={color}\n clipPath={`url(#${uniqueId})`}\n />\n <path\n d=\"M9.93555 4.40039C12.1061 4.40039 13.2998 5.8386 13.2998 7.35156C13.2997 8.52045 12.2922 9.61789 11.8262 9.94238C11.3601 10.2669 11.209 10.5 11.209 10.5C11.0283 10.6756 10.9117 11.0195 10.8721 11.2715C10.8316 11.5286 10.8476 11.5136 10.8477 11.7998V11.9004H9.20117V11.2715C9.20117 10.8463 9.20556 10.7433 9.31934 10.374C9.43483 9.99921 9.75195 9.54492 10.0928 9.18262C10.4336 8.82031 10.751 8.58105 10.751 8.58105C11.1983 8.25659 11.3818 7.87361 11.3818 7.42285C11.3818 7.07417 11.2638 6.74031 11.0283 6.49414C10.794 6.24916 10.435 6.08301 9.93555 6.08301C8.94209 6.08316 8.41811 6.83977 8.41797 7.60742C8.41797 7.81763 8.44731 8.07481 8.49805 8.21582L8.5498 8.36035L6.7793 8.23535L6.70898 8.23047L6.69043 8.16309C6.63105 7.95321 6.60059 7.71544 6.60059 7.47949C6.60081 6.00363 7.71413 4.40053 9.93555 4.40039Z\"\n fill={color}\n />\n <path\n d=\"M10 12.7998C10.6024 12.7999 11.0996 13.31 11.0996 13.9072C11.0994 14.506 10.6023 14.9999 10 15C9.38173 15 8.8996 14.506 8.89941 13.9072C8.89941 13.31 9.38162 12.7998 10 12.7998Z\"\n fill={color}\n />\n </>\n );\n const normalSizeStrongWeight = (\n <>\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M10.0004 0C4.48644 0 0 4.48565 0 9.99961C0 15.5136 4.48644 20 10.0004 20C15.5144 20 20 15.5136 20 9.99961C20 4.48565 15.5144 0 10.0004 0Z\"\n />\n <path\n d=\"M9.93555 4.40039C12.1061 4.40039 13.2998 5.8386 13.2998 7.35156C13.2997 8.52045 12.2922 9.61789 11.8262 9.94238C11.3601 10.2669 11.209 10.5 11.209 10.5C11.0283 10.6756 10.9117 11.0195 10.8721 11.2715C10.8316 11.5286 10.8476 11.5136 10.8477 11.7998V11.9004H9.20117V11.2715C9.20117 10.8463 9.20556 10.7433 9.31934 10.374C9.43483 9.99921 9.75195 9.54492 10.0928 9.18262C10.4336 8.82031 10.751 8.58105 10.751 8.58105C11.1983 8.25659 11.3818 7.87361 11.3818 7.42285C11.3818 7.07417 11.2638 6.74031 11.0283 6.49414C10.794 6.24916 10.435 6.08301 9.93555 6.08301C8.94209 6.08316 8.41811 6.83977 8.41797 7.60742C8.41797 7.81763 8.44731 8.07481 8.49805 8.21582L8.5498 8.36035L6.7793 8.23535L6.70898 8.23047L6.69043 8.16309C6.63105 7.95321 6.60059 7.71544 6.60059 7.47949C6.60081 6.00363 7.71413 4.40053 9.93555 4.40039Z\"\n fill=\"white\"\n />\n <path\n d=\"M10 12.7998C10.6024 12.7999 11.0996 13.31 11.0996 13.9072C11.0994 14.506 10.6023 14.9999 10 15C9.38173 15 8.8996 14.506 8.89941 13.9072C8.89941 13.31 9.38162 12.7998 10 12.7998Z\"\n fill=\"white\"\n />\n </>\n );\n\n const xlSizeNormalWeight = (\n <>\n <mask id={maskIdNormal} fill=\"white\">\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M16.0006 0C7.1783 0 0 7.17704 0 15.9994C0 24.8217 7.1783 32 16.0006 32C24.823 32 32 24.8217 32 15.9994C32 7.17704 24.823 0 16.0006 0Z\"\n />\n </mask>\n <path\n d=\"M16.0006 0V-2.5C5.79784 -2.5 -2.5 5.79607 -2.5 15.9994H0H2.5C2.5 8.55801 8.55876 2.5 16.0006 2.5V0ZM0 15.9994H-2.5C-2.5 26.2024 5.79759 34.5 16.0006 34.5V32V29.5C8.55901 29.5 2.5 23.441 2.5 15.9994H0ZM16.0006 32V34.5C26.2039 34.5 34.5 26.2022 34.5 15.9994H32H29.5C29.5 23.4412 23.442 29.5 16.0006 29.5V32ZM32 15.9994H34.5C34.5 5.79633 26.2037 -2.5 16.0006 -2.5V0V2.5C23.4422 2.5 29.5 8.55775 29.5 15.9994H32Z\"\n fill={color}\n mask={`url(#${maskIdNormal})`}\n />\n <path\n d=\"M17.4163 22.5791C17.346 21.8763 16.7971 21.2926 16.1229 21.2178L15.9768 21.21C15.1652 21.21 14.527 21.9087 14.527 22.7314L14.5345 22.8838C14.6074 23.6343 15.2122 24.2295 15.9768 24.2295L16.1229 24.2217C16.8485 24.1441 17.4235 23.499 17.4238 22.7314L17.4163 22.5791ZM20.8 12.2422C20.7999 9.96839 19.0841 7.77051 15.8775 7.77051C12.6128 7.77074 11.0003 10.2117 11 12.4473L11.0084 12.7139C11.0234 12.9568 11.06 13.1939 11.1143 13.4111L13.4088 13.5801C13.3619 13.3918 13.3316 13.1536 13.3179 12.9258L13.3095 12.6514C13.3097 11.9825 13.5283 11.3114 13.9632 10.8047C14.4018 10.2939 15.0496 9.96302 15.8775 9.96289L16.1763 9.97559C16.8509 10.0367 17.3678 10.3057 17.7272 10.6973L17.8714 10.8721C18.1839 11.2942 18.3369 11.8198 18.3369 12.3564L18.3331 12.5059C18.2951 13.2469 17.9677 13.8808 17.272 14.4082L17.273 14.4092L17.2692 14.4131C17.266 14.4157 17.26 14.4194 17.2533 14.4248C17.2399 14.4357 17.22 14.4522 17.1943 14.4736C17.1425 14.5169 17.0672 14.5812 16.9761 14.6631C16.7936 14.8271 16.5476 15.0619 16.2933 15.3438C15.8449 15.8409 15.4379 16.4338 15.2351 16.9404L15.1611 17.1523C15.0753 17.4427 15.035 17.615 15.014 17.793C14.9926 17.9752 14.9906 18.1713 14.9906 18.5146V19.2705H17.036C17.0332 18.9144 17.0171 18.8806 17.0782 18.4756L17.1081 18.3047C17.1447 18.1284 17.1994 17.9383 17.2702 17.7568C17.3585 17.5304 17.4807 17.301 17.6401 17.1289C17.6424 17.1254 17.6454 17.1217 17.6485 17.1172C17.6585 17.1027 17.6727 17.0824 17.6916 17.0576C17.7294 17.0082 17.7859 16.9393 17.8649 16.8545C18.0232 16.6846 18.2716 16.451 18.6413 16.1826C18.9712 15.9431 19.517 15.3982 19.9787 14.6826C20.4117 14.0113 20.7551 13.215 20.7963 12.4043L20.8 12.2422Z\"\n fill={color}\n />\n </>\n );\n\n const xlSizeOnMobileNormalWeight = (\n <>\n <mask id={maskIdMobile} fill=\"white\">\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M12.0005 0C5.38373 0 0 5.38278 0 11.9995C0 18.6163 5.38373 24 12.0005 24C18.6172 24 24 18.6163 24 11.9995C24 5.38278 18.6172 0 12.0005 0Z\"\n />\n </mask>\n <path\n d=\"M12.0005 0V-2.2C4.16892 -2.2 -2.2 4.16753 -2.2 11.9995H0H2.2C2.2 6.59803 6.59853 2.2 12.0005 2.2V0ZM0 11.9995H-2.2C-2.2 19.8313 4.1687 26.2 12.0005 26.2V24V21.8C6.59875 21.8 2.2 17.4012 2.2 11.9995H0ZM12.0005 24V26.2C19.8325 26.2 26.2 19.8311 26.2 11.9995H24H21.8C21.8 17.4015 17.402 21.8 12.0005 21.8V24ZM24 11.9995H26.2C26.2 4.16775 19.8322 -2.2 12.0005 -2.2V0V2.2C17.4022 2.2 21.8 6.59781 21.8 11.9995H24Z\"\n fill={color}\n mask={`url(#${maskIdMobile})`}\n />\n <path\n d=\"M11.9229 5.28027C14.5275 5.28027 15.96 7.00613 15.96 8.82168C15.9599 10.2243 14.7509 11.5413 14.1916 11.9307C13.6323 12.3201 13.451 12.5998 13.451 12.5998C13.2342 12.8105 13.0943 13.2232 13.0467 13.5256C12.9982 13.8341 13.0174 13.8161 13.0174 14.1596V14.2803H11.0416V13.5256C11.0416 13.0154 11.0469 12.8918 11.1834 12.4486C11.322 11.9989 11.7025 11.4537 12.1115 11.0189C12.5205 10.5842 12.9014 10.2971 12.9014 10.2971C13.4382 9.90771 13.6584 9.44814 13.6584 8.90723C13.6584 8.48881 13.5167 8.08818 13.2342 7.79277C12.953 7.49879 12.5222 7.29941 11.9229 7.29941C10.7307 7.2996 10.1019 8.20752 10.1018 9.12871C10.1018 9.38096 10.137 9.68958 10.1979 9.85879L10.26 10.0322L8.13535 9.88223L8.05098 9.87637L8.02871 9.79551C7.95745 9.54366 7.9209 9.25834 7.9209 8.9752C7.92117 7.20416 9.25715 5.28045 11.9229 5.28027Z\"\n fill={color}\n />\n <path\n d=\"M12.0002 15.3596C12.7231 15.3596 13.3197 15.9718 13.3197 16.6885C13.3195 17.407 12.7229 17.9997 12.0002 17.9998C11.2583 17.9998 10.6797 17.407 10.6795 16.6885C10.6795 15.9717 11.2581 15.3596 12.0002 15.3596Z\"\n fill={color}\n />\n </>\n );\n\n function getPaths(): React.ReactNode {\n if (size === 'xlarge') {\n if (weight === 'normal') {\n return isMobile ? xlSizeOnMobileNormalWeight : xlSizeNormalWeight;\n } else if (weight === 'strong') {\n return normalSizeStrongWeight;\n }\n } else {\n if (weight === 'normal') {\n return normalSizeNormalWeight;\n } else if (weight === 'strong') {\n return normalSizeStrongWeight;\n }\n }\n return null;\n }\n const paths = getPaths();\n\n function getSizesAndViewbox(): { widthAndHeight: number; viewBox: string } {\n if (size === 'xlarge') {\n if (isMobile) {\n return { widthAndHeight: 24, viewBox: '0 0 24 24' };\n }\n return { widthAndHeight: 32, viewBox: '0 0 32 32' };\n }\n return { widthAndHeight: 20, viewBox: '0 0 20 20' };\n }\n const { widthAndHeight, viewBox } = getSizesAndViewbox();\n\n return (\n <svg\n fill=\"none\"\n width={widthAndHeight}\n height={widthAndHeight}\n overflow=\"visible\"\n role={'presentation'}\n viewBox={viewBox}\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n {paths}\n </svg>\n );\n};\n\nexport default HelpSign;\n","import React from 'react';\n\nimport classNames from 'classnames';\n\nimport HelpSign from './HelpSign';\nimport { AnalyticsId } from '../../constants';\nimport { usePseudoClasses } from '../../hooks/usePseudoClasses';\nimport { getAriaLabelAttributes } from '../../utils/accessibility';\nimport { mergeRefs } from '../../utils/refs';\n\nimport styles from './styles.module.scss';\n\nexport type HelpTriggerIconSizes = 'inherit' | 'medium' | 'large' | 'xlarge';\n\nexport type HelpTriggerIconTags = 'button' | 'span';\n\nexport type HelpTriggerWeights = 'normal' | 'strong';\n\nexport interface HelpTriggerIconProps extends Pick<\n React.InputHTMLAttributes<HTMLButtonElement>,\n 'onClick' | 'aria-haspopup' | 'aria-controls' | 'aria-expanded'\n> {\n /**\n * Sets aria-label of the trigger. ariaLabel or ariaLabelledById MUST be set!\n */\n ariaLabel?: string;\n /**\n * Sets aria-labelledby of the trigger. ariaLabel or ariaLabelledById MUST be set!\n */\n ariaLabelledById?: string;\n /** Adds custom classes to the element. */\n className?: string;\n /**\n * Size of the Icon. Default: medium.\n */\n size?: HelpTriggerIconSizes;\n /** Sets the data-testid attribute. */\n testId?: string;\n /**\n * Sets the colors of the help trigger icon. Default: normal.\n */\n weight?: HelpTriggerWeights;\n}\n\ninterface HelpTriggerIconInternalProps extends HelpTriggerIconProps {\n /**\n * Sets the hover styling of the trigger. Intended for use when wrapped by a parent button.\n */\n isHovered?: boolean;\n /**\n * Only use this if the parent wrapper is a Button!\n * Changes the underlying element of the trigger. If set to span, the trigger will be a non-interactive icon. Default: button\n */\n htmlMarkup?: HelpTriggerIconTags;\n}\n\nconst getIconColor = (hover: boolean, weight: HelpTriggerWeights): string | undefined => {\n if (weight === 'normal') {\n return hover ? 'var(--color-help-graphics-verydark)' : 'var(--color-help-graphics-normal)';\n }\n};\n\nconst HelpTriggerIcon = React.forwardRef<HTMLButtonElement, HelpTriggerIconProps>((props, ref) => {\n return <HelpTriggerIconInternal {...props} ref={ref} />;\n});\n\nexport const HelpTriggerIconInternal = React.forwardRef<HTMLButtonElement, HelpTriggerIconInternalProps>(\n (\n {\n ariaLabel,\n ariaLabelledById,\n className,\n htmlMarkup = 'button',\n isHovered = false,\n size = 'medium',\n testId,\n weight = 'normal',\n ...buttonRest\n },\n ref\n ) => {\n const ariaLabelAttributes = getAriaLabelAttributes({ label: ariaLabel, id: ariaLabelledById });\n const { refObject, isHovered: interalIsHovered } = usePseudoClasses<HTMLButtonElement>(ref as React.RefObject<HTMLButtonElement>);\n const helpIcon = <HelpSign color={getIconColor(interalIsHovered || isHovered, weight)} size={size} weight={weight} />;\n const isButton = htmlMarkup === 'button';\n const iconClasses = classNames(\n styles['help-trigger-icon'],\n {\n [styles['help-trigger-icon--strong']]: weight === 'strong',\n [styles['help-trigger-icon--is-button']]: isButton,\n },\n styles[`help-trigger-icon--${size}`],\n className\n );\n\n if (isButton) {\n return (\n <button\n {...ariaLabelAttributes}\n type=\"button\"\n data-testid={testId}\n data-analyticsid={AnalyticsId.HelpTriggerIcon}\n className={iconClasses}\n ref={mergeRefs([refObject, ref])}\n {...buttonRest}\n >\n {helpIcon}\n </button>\n );\n }\n\n return (\n <span data-testid={testId} data-analyticsid={AnalyticsId.HelpTriggerIcon} className={iconClasses}>\n {helpIcon}\n </span>\n );\n }\n);\n\nHelpTriggerIcon.displayName = 'HelpTriggerIcon';\nHelpTriggerIconInternal.displayName = 'HelpTriggerIconInternal';\n\nexport default HelpTriggerIcon;\n","import HelpTriggerIcon from './HelpTriggerIcon';\nexport * from './HelpTriggerIcon';\nexport default HelpTriggerIcon;\n"],"mappings":"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"}
|
package/lib/IllustrationNames.js
CHANGED
|
@@ -6,8 +6,10 @@ const IllustrationList = [
|
|
|
6
6
|
"GiveBabyFood",
|
|
7
7
|
"HealthcarePersonnel",
|
|
8
8
|
"ReadLetters",
|
|
9
|
+
"Stork",
|
|
9
10
|
"Stroller",
|
|
10
|
-
"Support2"
|
|
11
|
+
"Support2",
|
|
12
|
+
"Thinking"
|
|
11
13
|
];
|
|
12
14
|
const IllustrationSizeList = {
|
|
13
15
|
BabyMobile: { medium: "BabyMobileMedium" },
|
|
@@ -23,8 +25,10 @@ const IllustrationSizeList = {
|
|
|
23
25
|
medium: "HealthcarePersonnelMedium"
|
|
24
26
|
},
|
|
25
27
|
ReadLetters: { medium: "ReadLettersMedium" },
|
|
28
|
+
Stork: { medium: "StorkMedium" },
|
|
26
29
|
Stroller: { medium: "StrollerMedium" },
|
|
27
|
-
Support2: { medium: "Support2Medium" }
|
|
30
|
+
Support2: { medium: "Support2Medium" },
|
|
31
|
+
Thinking: { medium: "ThinkingMedium" }
|
|
28
32
|
};
|
|
29
33
|
export { IllustrationSizeList as n, IllustrationList as t };
|
|
30
34
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IllustrationNames.js","names":["IllustrationSizeList: Record<IllustrationName, IllustrationSize>"],"sources":["../src/components/Illustrations/IllustrationNames.ts"],"sourcesContent":["/** AUTO-GENERATED - DO NOT CHANGE MANUALLY **/\n\nexport const IllustrationList = [\n 'BabyMobile',\n 'Child',\n 'Doctor',\n 'FacialRecognitionFingerprint',\n 'GiveBabyFood',\n 'HealthcarePersonnel',\n 'ReadLetters',\n 'Stroller',\n 'Support2',\n] as const;\n\nexport interface IllustrationSize {\n small?: string;\n medium?: string;\n large?: string;\n}\n\nexport const IllustrationSizeList: Record<IllustrationName, IllustrationSize> = {\n BabyMobile: { medium: 'BabyMobileMedium' },\n Child: { medium: 'ChildMedium' },\n Doctor: { small: 'DoctorSmall', medium: 'DoctorMedium' },\n FacialRecognitionFingerprint: { medium: 'FacialRecognitionFingerprintMedium' },\n GiveBabyFood: { medium: 'GiveBabyFoodMedium' },\n HealthcarePersonnel: { small: 'HealthcarePersonnelSmall', medium: 'HealthcarePersonnelMedium' },\n ReadLetters: { medium: 'ReadLettersMedium' },\n Stroller: { medium: 'StrollerMedium' },\n Support2: { medium: 'Support2Medium' },\n};\n\nexport type IllustrationName = (typeof IllustrationList)[number];\n"],"mappings":"AAEA,MAAa,mBAAmB;CAC9B;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD;AAQD,MAAaA,uBAAmE;CAC9E,YAAY,EAAE,QAAQ,oBAAoB;CAC1C,OAAO,EAAE,QAAQ,eAAe;CAChC,QAAQ;EAAE,OAAO;EAAe,QAAQ;EAAgB;CACxD,8BAA8B,EAAE,QAAQ,sCAAsC;CAC9E,cAAc,EAAE,QAAQ,sBAAsB;CAC9C,qBAAqB;EAAE,OAAO;EAA4B,QAAQ;EAA6B;CAC/F,aAAa,EAAE,QAAQ,qBAAqB;CAC5C,UAAU,EAAE,QAAQ,kBAAkB;CACtC,UAAU,EAAE,QAAQ,kBAAkB;CACvC"}
|
|
1
|
+
{"version":3,"file":"IllustrationNames.js","names":["IllustrationSizeList: Record<IllustrationName, IllustrationSize>"],"sources":["../src/components/Illustrations/IllustrationNames.ts"],"sourcesContent":["/** AUTO-GENERATED - DO NOT CHANGE MANUALLY **/\n\nexport const IllustrationList = [\n 'BabyMobile',\n 'Child',\n 'Doctor',\n 'FacialRecognitionFingerprint',\n 'GiveBabyFood',\n 'HealthcarePersonnel',\n 'ReadLetters',\n 'Stork',\n 'Stroller',\n 'Support2',\n 'Thinking',\n] as const;\n\nexport interface IllustrationSize {\n small?: string;\n medium?: string;\n large?: string;\n}\n\nexport const IllustrationSizeList: Record<IllustrationName, IllustrationSize> = {\n BabyMobile: { medium: 'BabyMobileMedium' },\n Child: { medium: 'ChildMedium' },\n Doctor: { small: 'DoctorSmall', medium: 'DoctorMedium' },\n FacialRecognitionFingerprint: { medium: 'FacialRecognitionFingerprintMedium' },\n GiveBabyFood: { medium: 'GiveBabyFoodMedium' },\n HealthcarePersonnel: { small: 'HealthcarePersonnelSmall', medium: 'HealthcarePersonnelMedium' },\n ReadLetters: { medium: 'ReadLettersMedium' },\n Stork: { medium: 'StorkMedium' },\n Stroller: { medium: 'StrollerMedium' },\n Support2: { medium: 'Support2Medium' },\n Thinking: { medium: 'ThinkingMedium' },\n};\n\nexport type IllustrationName = (typeof IllustrationList)[number];\n"],"mappings":"AAEA,MAAa,mBAAmB;CAC9B;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD;AAQD,MAAaA,uBAAmE;CAC9E,YAAY,EAAE,QAAQ,oBAAoB;CAC1C,OAAO,EAAE,QAAQ,eAAe;CAChC,QAAQ;EAAE,OAAO;EAAe,QAAQ;EAAgB;CACxD,8BAA8B,EAAE,QAAQ,sCAAsC;CAC9E,cAAc,EAAE,QAAQ,sBAAsB;CAC9C,qBAAqB;EAAE,OAAO;EAA4B,QAAQ;EAA6B;CAC/F,aAAa,EAAE,QAAQ,qBAAqB;CAC5C,OAAO,EAAE,QAAQ,eAAe;CAChC,UAAU,EAAE,QAAQ,kBAAkB;CACtC,UAAU,EAAE,QAAQ,kBAAkB;CACtC,UAAU,EAAE,QAAQ,kBAAkB;CACvC"}
|
package/lib/Label.js
CHANGED
|
@@ -59,7 +59,7 @@ const renderLabel = (label, inputId, onColor, markup) => {
|
|
|
59
59
|
onColor
|
|
60
60
|
}) });
|
|
61
61
|
};
|
|
62
|
-
const renderLabelAsParent = (label, children, inputId, onColor, labelClassName, labelTextClassName, sublabelWrapperClassName, large, markup) => {
|
|
62
|
+
const renderLabelAsParent = (label, children, inputId, onColor, labelClassName, labelTextClassName, sublabelWrapperClassName, large, markup, afterLabelChildrenClassName) => {
|
|
63
63
|
return /* @__PURE__ */ jsx(Fragment, { children: label && isComponent(label, Label) ? React.cloneElement(label, {
|
|
64
64
|
htmlFor: inputId,
|
|
65
65
|
onColor,
|
|
@@ -69,7 +69,8 @@ const renderLabelAsParent = (label, children, inputId, onColor, labelClassName,
|
|
|
69
69
|
htmlMarkup: markup || "label",
|
|
70
70
|
sublabelWrapperClassName,
|
|
71
71
|
sublabel: large ? void 0 : label.props.sublabel,
|
|
72
|
-
statusDot: large ? void 0 : label.props.statusDot
|
|
72
|
+
statusDot: large ? void 0 : label.props.statusDot,
|
|
73
|
+
afterLabelChildrenClassName
|
|
73
74
|
}) : typeof label === "string" && /* @__PURE__ */ jsx(Label, {
|
|
74
75
|
labelTexts: [{
|
|
75
76
|
text: label,
|
|
@@ -81,15 +82,15 @@ const renderLabelAsParent = (label, children, inputId, onColor, labelClassName,
|
|
|
81
82
|
labelClassName,
|
|
82
83
|
labelTextClassName,
|
|
83
84
|
sublabelWrapperClassName,
|
|
85
|
+
afterLabelChildrenClassName,
|
|
84
86
|
children
|
|
85
87
|
}) });
|
|
86
88
|
};
|
|
87
|
-
var Label = ({ afterLabelChildren, children, className, formFieldTag, htmlFor, htmlMarkup = "label", labelClassName, labelTextClassName, labelId, labelTexts, onColor = FormOnColor.onwhite, statusDot, sublabel, sublabelWrapperClassName, testId }) => {
|
|
89
|
+
var Label = ({ afterLabelChildren, children, className, formFieldTag, htmlFor, htmlMarkup = "label", labelClassName, labelTextClassName, labelId, labelTexts, onColor = FormOnColor.onwhite, statusDot, sublabel, sublabelWrapperClassName, testId, afterLabelChildrenClassName }) => {
|
|
88
90
|
const hasChildren = children && typeof children !== "undefined";
|
|
89
|
-
const labelWrapperClasses = classNames(styles["label-wrapper"], {
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
}, className);
|
|
91
|
+
const labelWrapperClasses = classNames(styles["label-wrapper"], { [styles["label-wrapper--no-bottom-margin"]]: hasChildren }, className);
|
|
92
|
+
const mainLabelWrapperClasses = classNames({ [styles["label-wrapper--after-label-children"]]: afterLabelChildren });
|
|
93
|
+
const afterLabelChildrenClasses = classNames(styles["after-label-children"], afterLabelChildrenClassName);
|
|
93
94
|
const mapLabels = () => {
|
|
94
95
|
if (typeof labelTexts === "undefined") return null;
|
|
95
96
|
return labelTexts.map((labelText, index) => {
|
|
@@ -106,19 +107,25 @@ var Label = ({ afterLabelChildren, children, className, formFieldTag, htmlFor, h
|
|
|
106
107
|
};
|
|
107
108
|
return /* @__PURE__ */ jsxs("div", {
|
|
108
109
|
className: labelWrapperClasses,
|
|
109
|
-
children: [/* @__PURE__ */ jsxs("div", {
|
|
110
|
-
className:
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
children:
|
|
118
|
-
className: styles
|
|
119
|
-
children:
|
|
120
|
-
|
|
121
|
-
|
|
110
|
+
children: [/* @__PURE__ */ jsxs("div", {
|
|
111
|
+
className: mainLabelWrapperClasses,
|
|
112
|
+
children: [/* @__PURE__ */ jsx(htmlMarkup, {
|
|
113
|
+
className: labelClassName,
|
|
114
|
+
id: labelId,
|
|
115
|
+
htmlFor,
|
|
116
|
+
"data-testid": testId,
|
|
117
|
+
"data-analyticsid": AnalyticsId.Label,
|
|
118
|
+
children: /* @__PURE__ */ jsxs("span", {
|
|
119
|
+
className: styles["label-content-wrapper"],
|
|
120
|
+
children: [children, /* @__PURE__ */ jsx("span", {
|
|
121
|
+
className: styles.label__texts,
|
|
122
|
+
children: mapLabels()
|
|
123
|
+
})]
|
|
124
|
+
})
|
|
125
|
+
}), afterLabelChildren && /* @__PURE__ */ jsx("div", {
|
|
126
|
+
className: afterLabelChildrenClasses,
|
|
127
|
+
children: afterLabelChildren
|
|
128
|
+
})]
|
|
122
129
|
}), (sublabel || statusDot || formFieldTag) && /* @__PURE__ */ jsxs("div", {
|
|
123
130
|
className: sublabelWrapperClassName,
|
|
124
131
|
children: [
|
|
@@ -126,9 +133,6 @@ var Label = ({ afterLabelChildren, children, className, formFieldTag, htmlFor, h
|
|
|
126
133
|
sublabel && isComponent(sublabel, Sublabel) && React.cloneElement(sublabel, { onColor }),
|
|
127
134
|
statusDot && isComponent(statusDot, StatusDot_default) && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Spacer_default, { size: "3xs" }), React.cloneElement(statusDot, { onColor: onColor === FormOnColor.ondark ? "ondark" : "onwhite" })] })
|
|
128
135
|
]
|
|
129
|
-
})] }), afterLabelChildren && /* @__PURE__ */ jsx("div", {
|
|
130
|
-
className: styles["after-label-children"],
|
|
131
|
-
children: afterLabelChildren
|
|
132
136
|
})]
|
|
133
137
|
});
|
|
134
138
|
};
|
package/lib/Label.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Label.js","names":["Sublabel: React.FC<SublabelProps>","Label: FunctionComponent<LabelProps>"],"sources":["../src/components/Label/SubLabel.tsx","../src/components/Label/Label.tsx","../src/components/Label/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport cn from 'classnames';\n\nimport { LabelText } from './Label';\nimport { AnalyticsId, FormOnColor } from '../../constants';\nimport Spacer from '../Spacer';\n\nimport styles from './styles.module.scss';\n\nexport interface SublabelProps {\n /** Sets the content of the Sublabel */\n children?: React.ReactNode;\n /** Adds custom classes to the element. */\n className?: string;\n /** id that is placed on the wrapper */\n id: string;\n /** Array of sublabel strings. Can be of type semibold or normal */\n onColor?: FormOnColor;\n /** Array of sublabel strings. Can be of type semibold or normal */\n sublabelTexts?: LabelText[];\n /** Sets the data-testid attribute. */\n testId?: string;\n}\n\nexport const Sublabel: React.FC<SublabelProps> = ({ children, className, id, onColor, sublabelTexts, testId }) => {\n const mapSublabels = (hideFromScreenReader?: boolean): React.ReactNode => {\n return (\n sublabelTexts &&\n sublabelTexts.map((sublabelText, index) => {\n const labelClasses = cn(styles.label, styles['sublabel'], {\n [styles['sublabel--subdued']]: sublabelText.type === 'subdued',\n [styles['sublabel--on-dark']]: onColor === FormOnColor.ondark,\n });\n return (\n hideFromScreenReader === sublabelText.hideFromScreenReader && (\n <span className={labelClasses} key={index}>\n {sublabelText.text}\n </span>\n )\n );\n })\n );\n };\n\n const subLabels = mapSublabels();\n const ariaHiddenSublabels = mapSublabels(true);\n\n return (\n <>\n <Spacer size={'3xs'} />\n {(subLabels || children) && (\n <div className={className} id={id} data-testid={testId} data-analyticsid={AnalyticsId.Sublabel}>\n {subLabels}\n {children}\n </div>\n )}\n {ariaHiddenSublabels && (\n <div className={className} data-testid={testId}>\n {ariaHiddenSublabels}\n </div>\n )}\n </>\n );\n};\n","import React, { FunctionComponent } from 'react';\n\nimport cn from 'classnames';\n\nimport { Sublabel, SublabelProps } from './SubLabel';\nimport { AnalyticsId, FormOnColor } from '../../constants';\nimport { isComponent } from '../../utils/component';\nimport FormFieldTag, { FormFieldTagProps } from '../FormFieldTag';\nimport Spacer from '../Spacer';\nimport StatusDot, { StatusDotProps } from '../StatusDot';\n\nimport styles from './styles.module.scss';\n\nexport type LabelText = {\n hideFromScreenReader?: boolean;\n text: string;\n type?: 'normal' | 'subdued';\n};\n\nexport type LabelTags = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'span' | 'label' | 'p' | 'legend';\n\nexport interface LabelProps {\n /** Component shown after label - discourage use of this */\n afterLabelChildren?: React.ReactNode;\n /** Sets the content of the Label */\n children?: React.ReactNode;\n /** Sets a tag that describes whether the form field is required or optional */\n formFieldTag?: React.ReactNode;\n /** Adds custom classes to the label tag. */\n labelClassName?: string;\n /** Adds custom classes to the label text. */\n labelTextClassName?: string;\n /** Adds custom classes to the element. */\n className?: string;\n /** Id that is put on the \"for\" attribute of the label */\n htmlFor?: string;\n /** Changes the underlying element of the label */\n htmlMarkup?: LabelTags;\n /** Id som plasseres på <label/> */\n labelId?: string;\n /** Array of main label strings. Can be of type semibold or normal */\n labelTexts?: LabelText[];\n /** Array of sublabel strings. Can be of type semibold or normal */\n onColor?: keyof typeof FormOnColor;\n /** StatusDot placed underneath the last sublabel */\n statusDot?: React.ReactNode;\n /** Sublabel component */\n sublabel?: React.ReactNode;\n /** Adds custom classes to the div wrapping the sublabels. */\n sublabelWrapperClassName?: string;\n /** Sets the data-testid attribute. */\n testId?: string;\n}\n\nexport const getLabelText = (label: React.ReactNode): string => {\n let allLabelText = '';\n\n if (isComponent<LabelProps>(label, Label)) {\n label.props.labelTexts?.forEach(labelText => {\n allLabelText += !labelText.hideFromScreenReader ? labelText.text : '';\n });\n }\n\n return allLabelText;\n};\n\nexport const renderLabel = (label: React.ReactNode, inputId: string, onColor: FormOnColor, markup?: LabelTags): React.ReactNode => {\n return (\n <>\n {label && isComponent<LabelProps>(label, Label)\n ? React.cloneElement(label, {\n htmlFor: inputId,\n htmlMarkup: markup || 'label',\n onColor,\n })\n : typeof label === 'string' && <Label labelTexts={[{ text: label, type: 'normal' }]} htmlFor={inputId} onColor={onColor} />}\n </>\n );\n};\n\nexport const renderLabelAsParent = (\n label: React.ReactNode,\n children: React.ReactNode,\n inputId: string,\n onColor: FormOnColor,\n labelClassName?: string,\n labelTextClassName?: string,\n sublabelWrapperClassName?: string,\n large?: boolean,\n markup?: LabelTags\n): React.ReactNode => {\n return (\n <>\n {label && isComponent<LabelProps>(label, Label)\n ? React.cloneElement(label, {\n htmlFor: inputId,\n onColor,\n children: children,\n labelClassName: cn(labelClassName, label.props.labelClassName),\n labelTextClassName: labelTextClassName,\n htmlMarkup: markup || 'label',\n sublabelWrapperClassName: sublabelWrapperClassName,\n sublabel: large ? undefined : label.props.sublabel,\n statusDot: large ? undefined : label.props.statusDot,\n })\n : typeof label === 'string' && (\n <Label\n labelTexts={[{ text: label, type: 'subdued' }]}\n htmlFor={inputId}\n onColor={onColor}\n htmlMarkup={markup || 'label'}\n labelClassName={labelClassName}\n labelTextClassName={labelTextClassName}\n sublabelWrapperClassName={sublabelWrapperClassName}\n >\n {children}\n </Label>\n )}\n </>\n );\n};\n\nconst Label: FunctionComponent<LabelProps> = ({\n afterLabelChildren,\n children,\n className,\n formFieldTag,\n htmlFor,\n htmlMarkup = 'label',\n labelClassName,\n labelTextClassName,\n labelId,\n labelTexts,\n onColor = FormOnColor.onwhite,\n statusDot,\n sublabel,\n sublabelWrapperClassName,\n testId,\n}) => {\n const hasChildren = children && typeof children !== 'undefined';\n const labelWrapperClasses = cn(\n styles['label-wrapper'],\n { [styles['label-wrapper--no-bottom-margin']]: hasChildren, [styles['label-wrapper--after-label-children']]: afterLabelChildren },\n className\n );\n\n const mapLabels = (): React.ReactNode => {\n if (typeof labelTexts === 'undefined') return null;\n\n return labelTexts.map((labelText, index) => {\n const labelClasses = cn(\n styles.label,\n {\n [styles['label--subdued']]: labelText.type === 'subdued',\n [styles['label--on-dark']]: onColor === FormOnColor.ondark,\n },\n labelTextClassName\n );\n return (\n <span aria-hidden={labelText.hideFromScreenReader} className={labelClasses} key={index}>\n {labelText.text}\n </span>\n );\n });\n };\n const CustomTag = htmlMarkup;\n\n return (\n <div className={labelWrapperClasses}>\n <div>\n <CustomTag className={labelClassName} id={labelId} htmlFor={htmlFor} data-testid={testId} data-analyticsid={AnalyticsId.Label}>\n <span className={styles['label-content-wrapper']}>\n {children}\n <span className={styles.label__texts}>{mapLabels()}</span>\n </span>\n </CustomTag>\n {(sublabel || statusDot || formFieldTag) && (\n <div className={sublabelWrapperClassName}>\n {formFieldTag && isComponent<FormFieldTagProps>(formFieldTag, FormFieldTag) && React.cloneElement(formFieldTag)}\n {sublabel &&\n isComponent<SublabelProps>(sublabel, Sublabel) &&\n React.cloneElement(sublabel, {\n onColor: onColor as FormOnColor,\n })}\n {statusDot && isComponent<StatusDotProps>(statusDot, StatusDot) && (\n <>\n <Spacer size={'3xs'} />\n {React.cloneElement(statusDot, {\n onColor: onColor === FormOnColor.ondark ? 'ondark' : 'onwhite',\n })}\n </>\n )}\n </div>\n )}\n </div>\n {afterLabelChildren && <div className={styles['after-label-children']}>{afterLabelChildren}</div>}\n </div>\n );\n};\n\nexport default Label;\n","import Label from './Label';\nexport { Sublabel } from './SubLabel';\nexport * from './Label';\nexport default Label;\n"],"mappings":";;;;;;;;;AAyBA,MAAaA,YAAqC,EAAE,UAAU,WAAW,IAAI,SAAS,eAAe,aAAa;CAChH,MAAM,gBAAgB,yBAAoD;AACxE,SACE,iBACA,cAAc,KAAK,cAAc,UAAU;GACzC,MAAM,eAAe,WAAG,OAAO,OAAO,OAAO,aAAa;KACvD,OAAO,uBAAuB,aAAa,SAAS;KACpD,OAAO,uBAAuB,YAAY,YAAY;IACxD,CAAC;AACF,UACE,yBAAyB,aAAa,wBACpC,oBAAC,QAAA;IAAK,WAAW;cACd,aAAa;MADoB,MAE7B;IAGX;;CAIN,MAAM,YAAY,cAAc;CAChC,MAAM,sBAAsB,aAAa,KAAK;AAE9C,QACE,qBAAA,UAAA,EAAA,UAAA;EACE,oBAAC,gBAAA,EAAO,MAAM,OAAA,CAAS;GACrB,aAAa,aACb,qBAAC,OAAA;GAAe;GAAe;GAAI,eAAa;GAAQ,oBAAkB,YAAY;cACnF,WACA,SAAA;IACG;EAEP,uBACC,oBAAC,OAAA;GAAe;GAAW,eAAa;aACrC;IACG;KAEP;;ACRP,MAAa,gBAAgB,UAAmC;CAC9D,IAAI,eAAe;AAEnB,KAAI,YAAwB,OAAO,MAAM,CACvC,OAAM,MAAM,YAAY,SAAQ,cAAa;AAC3C,kBAAgB,CAAC,UAAU,uBAAuB,UAAU,OAAO;GACnE;AAGJ,QAAO;;AAGT,MAAa,eAAe,OAAwB,SAAiB,SAAsB,WAAwC;AACjI,QACE,oBAAA,UAAA,EAAA,UACG,SAAS,YAAwB,OAAO,MAAM,GAC3C,MAAM,aAAa,OAAO;EACxB,SAAS;EACT,YAAY,UAAU;EACtB;EACD,CAAC,GACF,OAAO,UAAU,YAAY,oBAAC,OAAA;EAAM,YAAY,CAAC;GAAE,MAAM;GAAO,MAAM;GAAU,CAAC;EAAE,SAAS;EAAkB;GAAW,EAAA,CAC5H;;AAIP,MAAa,uBACX,OACA,UACA,SACA,SACA,gBACA,oBACA,0BACA,OACA,WACoB;AACpB,QACE,oBAAA,UAAA,EAAA,UACG,SAAS,YAAwB,OAAO,MAAM,GAC3C,MAAM,aAAa,OAAO;EACxB,SAAS;EACT;EACU;EACV,gBAAgB,WAAG,gBAAgB,MAAM,MAAM,eAAe;EAC1C;EACpB,YAAY,UAAU;EACI;EAC1B,UAAU,QAAQ,KAAA,IAAY,MAAM,MAAM;EAC1C,WAAW,QAAQ,KAAA,IAAY,MAAM,MAAM;EAC5C,CAAC,GACF,OAAO,UAAU,YACf,oBAAC,OAAA;EACC,YAAY,CAAC;GAAE,MAAM;GAAO,MAAM;GAAW,CAAC;EAC9C,SAAS;EACA;EACT,YAAY,UAAU;EACN;EACI;EACM;EAEzB;GACK,EAAA,CAEb;;AAIP,IAAMC,SAAwC,EAC5C,oBACA,UACA,WACA,cACA,SACA,aAAa,SACb,gBACA,oBACA,SACA,YACA,UAAU,YAAY,SACtB,WACA,UACA,0BACA,aACI;CACJ,MAAM,cAAc,YAAY,OAAO,aAAa;CACpD,MAAM,sBAAsB,WAC1B,OAAO,kBACP;GAAG,OAAO,qCAAqC;GAAc,OAAO,yCAAyC;EAAoB,EACjI,UACD;CAED,MAAM,kBAAmC;AACvC,MAAI,OAAO,eAAe,YAAa,QAAO;AAE9C,SAAO,WAAW,KAAK,WAAW,UAAU;GAC1C,MAAM,eAAe,WACnB,OAAO,OACP;KACG,OAAO,oBAAoB,UAAU,SAAS;KAC9C,OAAO,oBAAoB,YAAY,YAAY;IACrD,EACD,mBACD;AACD,UACE,oBAAC,QAAA;IAAK,eAAa,UAAU;IAAsB,WAAW;cAC3D,UAAU;MADoE,MAE1E;IAET;;AAIJ,QACE,qBAAC,OAAA;EAAI,WAAW;aACd,qBAAC,OAAA,EAAA,UAAA,CACC,oBALY,YAKX;GAAU,WAAW;GAAgB,IAAI;GAAkB;GAAS,eAAa;GAAQ,oBAAkB,YAAY;aACtH,qBAAC,QAAA;IAAK,WAAW,OAAO;eACrB,UACD,oBAAC,QAAA;KAAK,WAAW,OAAO;eAAe,WAAW;MAAQ,CAAA;KACrD;IACG,GACV,YAAY,aAAa,iBACzB,qBAAC,OAAA;GAAI,WAAW;;IACb,gBAAgB,YAA+B,cAAc,qBAAa,IAAI,MAAM,aAAa,aAAa;IAC9G,YACC,YAA2B,UAAU,SAAS,IAC9C,MAAM,aAAa,UAAU,EAClB,SACV,CAAC;IACH,aAAa,YAA4B,WAAW,kBAAU,IAC7D,qBAAA,UAAA,EAAA,UAAA,CACE,oBAAC,gBAAA,EAAO,MAAM,OAAA,CAAS,EACtB,MAAM,aAAa,WAAW,EAC7B,SAAS,YAAY,YAAY,SAAS,WAAW,WACtD,CAAC,CAAA,EAAA,CACD;;IAED,CAAA,EAAA,CAEJ,EACL,sBAAsB,oBAAC,OAAA;GAAI,WAAW,OAAO;aAA0B;IAAyB,CAAA;GAC7F;;ACjMV,IAAA,kBDqMe"}
|
|
1
|
+
{"version":3,"file":"Label.js","names":["Sublabel: React.FC<SublabelProps>","Label: FunctionComponent<LabelProps>"],"sources":["../src/components/Label/SubLabel.tsx","../src/components/Label/Label.tsx","../src/components/Label/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport cn from 'classnames';\n\nimport { LabelText } from './Label';\nimport { AnalyticsId, FormOnColor } from '../../constants';\nimport Spacer from '../Spacer';\n\nimport styles from './styles.module.scss';\n\nexport interface SublabelProps {\n /** Sets the content of the Sublabel */\n children?: React.ReactNode;\n /** Adds custom classes to the element. */\n className?: string;\n /** id that is placed on the wrapper */\n id: string;\n /** Array of sublabel strings. Can be of type semibold or normal */\n onColor?: FormOnColor;\n /** Array of sublabel strings. Can be of type semibold or normal */\n sublabelTexts?: LabelText[];\n /** Sets the data-testid attribute. */\n testId?: string;\n}\n\nexport const Sublabel: React.FC<SublabelProps> = ({ children, className, id, onColor, sublabelTexts, testId }) => {\n const mapSublabels = (hideFromScreenReader?: boolean): React.ReactNode => {\n return (\n sublabelTexts &&\n sublabelTexts.map((sublabelText, index) => {\n const labelClasses = cn(styles.label, styles['sublabel'], {\n [styles['sublabel--subdued']]: sublabelText.type === 'subdued',\n [styles['sublabel--on-dark']]: onColor === FormOnColor.ondark,\n });\n return (\n hideFromScreenReader === sublabelText.hideFromScreenReader && (\n <span className={labelClasses} key={index}>\n {sublabelText.text}\n </span>\n )\n );\n })\n );\n };\n\n const subLabels = mapSublabels();\n const ariaHiddenSublabels = mapSublabels(true);\n\n return (\n <>\n <Spacer size={'3xs'} />\n {(subLabels || children) && (\n <div className={className} id={id} data-testid={testId} data-analyticsid={AnalyticsId.Sublabel}>\n {subLabels}\n {children}\n </div>\n )}\n {ariaHiddenSublabels && (\n <div className={className} data-testid={testId}>\n {ariaHiddenSublabels}\n </div>\n )}\n </>\n );\n};\n","import React, { FunctionComponent } from 'react';\n\nimport cn from 'classnames';\n\nimport { Sublabel, SublabelProps } from './SubLabel';\nimport { AnalyticsId, FormOnColor } from '../../constants';\nimport { isComponent } from '../../utils/component';\nimport FormFieldTag, { FormFieldTagProps } from '../FormFieldTag';\nimport Spacer from '../Spacer';\nimport StatusDot, { StatusDotProps } from '../StatusDot';\n\nimport styles from './styles.module.scss';\n\nexport type LabelText = {\n hideFromScreenReader?: boolean;\n text: string;\n type?: 'normal' | 'subdued';\n};\n\nexport type LabelTags = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'span' | 'label' | 'p' | 'legend';\n\nexport interface LabelProps {\n /** Component shown after label - discourage use of this */\n afterLabelChildren?: React.ReactNode;\n /** Sets the content of the Label */\n children?: React.ReactNode;\n /** Sets a tag that describes whether the form field is required or optional */\n formFieldTag?: React.ReactNode;\n /** Adds custom classes to the label tag. */\n labelClassName?: string;\n /** Adds custom classes to the label text. */\n labelTextClassName?: string;\n /** Adds custom classes to the element. */\n className?: string;\n /** Id that is put on the \"for\" attribute of the label */\n htmlFor?: string;\n /** Changes the underlying element of the label */\n htmlMarkup?: LabelTags;\n /** Id som plasseres på <label/> */\n labelId?: string;\n /** Array of main label strings. Can be of type semibold or normal */\n labelTexts?: LabelText[];\n /** Array of sublabel strings. Can be of type semibold or normal */\n onColor?: keyof typeof FormOnColor;\n /** StatusDot placed underneath the last sublabel */\n statusDot?: React.ReactNode;\n /** Sublabel component */\n sublabel?: React.ReactNode;\n /** Adds custom classes to the div wrapping the sublabels. */\n sublabelWrapperClassName?: string;\n /** Sets the data-testid attribute. */\n testId?: string;\n /** Gives a custom classname to the afterLabelChildren wrapper. Used in checkbox and radiobutton */\n afterLabelChildrenClassName?: string;\n}\n\nexport const getLabelText = (label: React.ReactNode): string => {\n let allLabelText = '';\n\n if (isComponent<LabelProps>(label, Label)) {\n label.props.labelTexts?.forEach(labelText => {\n allLabelText += !labelText.hideFromScreenReader ? labelText.text : '';\n });\n }\n\n return allLabelText;\n};\n\nexport const renderLabel = (label: React.ReactNode, inputId: string, onColor: FormOnColor, markup?: LabelTags): React.ReactNode => {\n return (\n <>\n {label && isComponent<LabelProps>(label, Label)\n ? React.cloneElement(label, {\n htmlFor: inputId,\n htmlMarkup: markup || 'label',\n onColor,\n })\n : typeof label === 'string' && <Label labelTexts={[{ text: label, type: 'normal' }]} htmlFor={inputId} onColor={onColor} />}\n </>\n );\n};\n\nexport const renderLabelAsParent = (\n label: React.ReactNode,\n children: React.ReactNode,\n inputId: string,\n onColor: FormOnColor,\n labelClassName?: string,\n labelTextClassName?: string,\n sublabelWrapperClassName?: string,\n large?: boolean,\n markup?: LabelTags,\n afterLabelChildrenClassName?: string\n): React.ReactNode => {\n return (\n <>\n {label && isComponent<LabelProps>(label, Label)\n ? React.cloneElement(label, {\n htmlFor: inputId,\n onColor,\n children: children,\n labelClassName: cn(labelClassName, label.props.labelClassName),\n labelTextClassName: labelTextClassName,\n htmlMarkup: markup || 'label',\n sublabelWrapperClassName: sublabelWrapperClassName,\n sublabel: large ? undefined : label.props.sublabel,\n statusDot: large ? undefined : label.props.statusDot,\n afterLabelChildrenClassName: afterLabelChildrenClassName,\n })\n : typeof label === 'string' && (\n <Label\n labelTexts={[{ text: label, type: 'subdued' }]}\n htmlFor={inputId}\n onColor={onColor}\n htmlMarkup={markup || 'label'}\n labelClassName={labelClassName}\n labelTextClassName={labelTextClassName}\n sublabelWrapperClassName={sublabelWrapperClassName}\n afterLabelChildrenClassName={afterLabelChildrenClassName}\n >\n {children}\n </Label>\n )}\n </>\n );\n};\n\nconst Label: FunctionComponent<LabelProps> = ({\n afterLabelChildren,\n children,\n className,\n formFieldTag,\n htmlFor,\n htmlMarkup = 'label',\n labelClassName,\n labelTextClassName,\n labelId,\n labelTexts,\n onColor = FormOnColor.onwhite,\n statusDot,\n sublabel,\n sublabelWrapperClassName,\n testId,\n afterLabelChildrenClassName,\n}) => {\n const hasChildren = children && typeof children !== 'undefined';\n const labelWrapperClasses = cn(styles['label-wrapper'], { [styles['label-wrapper--no-bottom-margin']]: hasChildren }, className);\n const mainLabelWrapperClasses = cn({\n [styles['label-wrapper--after-label-children']]: afterLabelChildren,\n });\n const afterLabelChildrenClasses = cn(styles['after-label-children'], afterLabelChildrenClassName);\n\n const mapLabels = (): React.ReactNode => {\n if (typeof labelTexts === 'undefined') return null;\n\n return labelTexts.map((labelText, index) => {\n const labelClasses = cn(\n styles.label,\n {\n [styles['label--subdued']]: labelText.type === 'subdued',\n [styles['label--on-dark']]: onColor === FormOnColor.ondark,\n },\n labelTextClassName\n );\n return (\n <span aria-hidden={labelText.hideFromScreenReader} className={labelClasses} key={index}>\n {labelText.text}\n </span>\n );\n });\n };\n const CustomTag = htmlMarkup;\n\n return (\n <div className={labelWrapperClasses}>\n <div className={mainLabelWrapperClasses}>\n <CustomTag className={labelClassName} id={labelId} htmlFor={htmlFor} data-testid={testId} data-analyticsid={AnalyticsId.Label}>\n <span className={styles['label-content-wrapper']}>\n {children}\n <span className={styles.label__texts}>{mapLabels()}</span>\n </span>\n </CustomTag>\n {afterLabelChildren && <div className={afterLabelChildrenClasses}>{afterLabelChildren}</div>}\n </div>\n {(sublabel || statusDot || formFieldTag) && (\n <div className={sublabelWrapperClassName}>\n {formFieldTag && isComponent<FormFieldTagProps>(formFieldTag, FormFieldTag) && React.cloneElement(formFieldTag)}\n {sublabel &&\n isComponent<SublabelProps>(sublabel, Sublabel) &&\n React.cloneElement(sublabel, {\n onColor: onColor as FormOnColor,\n })}\n {statusDot && isComponent<StatusDotProps>(statusDot, StatusDot) && (\n <>\n <Spacer size={'3xs'} />\n {React.cloneElement(statusDot, {\n onColor: onColor === FormOnColor.ondark ? 'ondark' : 'onwhite',\n })}\n </>\n )}\n </div>\n )}\n </div>\n );\n};\n\nexport default Label;\n","import Label from './Label';\nexport { Sublabel } from './SubLabel';\nexport * from './Label';\nexport default Label;\n"],"mappings":"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"}
|
package/lib/LazyIllustration.js
CHANGED
|
@@ -28,10 +28,14 @@ const lazyLoadIllustration = (illustrationName, size) => {
|
|
|
28
28
|
"../Illustrations/HealthcarePersonnelSmall.tsx": () => import("./components/Illustrations/HealthcarePersonnelSmall.js"),
|
|
29
29
|
"../Illustrations/ReadLetters.tsx": () => import("./components/Illustrations/ReadLetters.js"),
|
|
30
30
|
"../Illustrations/ReadLettersMedium.tsx": () => import("./components/Illustrations/ReadLettersMedium.js"),
|
|
31
|
+
"../Illustrations/Stork.tsx": () => import("./components/Illustrations/Stork.js"),
|
|
32
|
+
"../Illustrations/StorkMedium.tsx": () => import("./components/Illustrations/StorkMedium.js"),
|
|
31
33
|
"../Illustrations/Stroller.tsx": () => import("./components/Illustrations/Stroller.js"),
|
|
32
34
|
"../Illustrations/StrollerMedium.tsx": () => import("./components/Illustrations/StrollerMedium.js"),
|
|
33
35
|
"../Illustrations/Support2.tsx": () => import("./components/Illustrations/Support2.js"),
|
|
34
|
-
"../Illustrations/Support2Medium.tsx": () => import("./components/Illustrations/Support2Medium.js")
|
|
36
|
+
"../Illustrations/Support2Medium.tsx": () => import("./components/Illustrations/Support2Medium.js"),
|
|
37
|
+
"../Illustrations/Thinking.tsx": () => import("./components/Illustrations/Thinking.js"),
|
|
38
|
+
"../Illustrations/ThinkingMedium.tsx": () => import("./components/Illustrations/ThinkingMedium.js")
|
|
35
39
|
}, `../Illustrations/${illustrationFileName}.tsx`, 3));
|
|
36
40
|
};
|
|
37
41
|
const LazyIllustration = ({ illustrationName, size = 512, ...rest }) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LazyIllustration.js","names":["LazyIllustration: React.FC<LazyIllustrationProps>"],"sources":["../src/components/LazyIllustration/LazyIllustration.tsx","../src/components/LazyIllustration/index.ts"],"sourcesContent":["import React, { lazy, Suspense, useMemo } from 'react';\n\nimport { useIsServerSide } from '../../hooks/useIsServerSide';\nimport Illustration, { BaseIllustrationProps, SvgIllustration } from '../Illustration';\nimport { getIllustration } from '../Illustration/utils';\nimport { IllustrationName, IllustrationSizeList } from '../Illustrations/IllustrationNames';\nimport ErrorBoundary from '../LazyIcon/ErrorBoundary';\n\nexport interface LazyIllustrationProps extends BaseIllustrationProps {\n // Navnet på illustrasjonen som skal vises. Tilsvarer filnavnet til illustrasjonen i Icons-mappen\n illustrationName: IllustrationName;\n}\n\nexport const lazyLoadIllustration = (illustrationName: IllustrationName, size: number): React.LazyExoticComponent<SvgIllustration> => {\n const sizes = IllustrationSizeList[illustrationName];\n const illustrationFileName = getIllustration({ size, ...sizes });\n\n return lazy<SvgIllustration>(() => import(`../Illustrations/${illustrationFileName}.tsx`));\n};\n\nexport const LazyIllustration: React.FC<LazyIllustrationProps> = ({ illustrationName, size = 512, ...rest }) => {\n const illustration = useMemo(() => lazyLoadIllustration(illustrationName, size), [illustrationName, size]);\n const isServerSide = useIsServerSide();\n\n if (isServerSide) {\n return null;\n }\n\n const fallback = (\n <svg\n data-testid={'fallback'}\n role={'presentation'}\n focusable={false}\n aria-hidden={true}\n viewBox=\"0 0 512 512\"\n style={{ minWidth: size, minHeight: size }}\n width={size}\n height={size}\n />\n );\n\n return (\n <ErrorBoundary fallback={fallback} reset={illustrationName}>\n <Suspense fallback={fallback}>\n <Illustration illustration={illustration} size={size} {...rest} />\n </Suspense>\n </ErrorBoundary>\n );\n};\n\nexport default LazyIllustration;\n","import LazyIllustration from './LazyIllustration';\nexport * from './LazyIllustration';\nexport default LazyIllustration;\n"],"mappings":";;;;;;;AAaA,MAAa,wBAAwB,kBAAoC,SAA6D;CACpI,MAAM,QAAQ,qBAAqB;CACnC,MAAM,uBAAuB,gBAAgB;EAAE;EAAM,GAAG;EAAO,CAAC;AAEhE,QAAO,WAAA,yCAAA
|
|
1
|
+
{"version":3,"file":"LazyIllustration.js","names":["LazyIllustration: React.FC<LazyIllustrationProps>"],"sources":["../src/components/LazyIllustration/LazyIllustration.tsx","../src/components/LazyIllustration/index.ts"],"sourcesContent":["import React, { lazy, Suspense, useMemo } from 'react';\n\nimport { useIsServerSide } from '../../hooks/useIsServerSide';\nimport Illustration, { BaseIllustrationProps, SvgIllustration } from '../Illustration';\nimport { getIllustration } from '../Illustration/utils';\nimport { IllustrationName, IllustrationSizeList } from '../Illustrations/IllustrationNames';\nimport ErrorBoundary from '../LazyIcon/ErrorBoundary';\n\nexport interface LazyIllustrationProps extends BaseIllustrationProps {\n // Navnet på illustrasjonen som skal vises. Tilsvarer filnavnet til illustrasjonen i Icons-mappen\n illustrationName: IllustrationName;\n}\n\nexport const lazyLoadIllustration = (illustrationName: IllustrationName, size: number): React.LazyExoticComponent<SvgIllustration> => {\n const sizes = IllustrationSizeList[illustrationName];\n const illustrationFileName = getIllustration({ size, ...sizes });\n\n return lazy<SvgIllustration>(() => import(`../Illustrations/${illustrationFileName}.tsx`));\n};\n\nexport const LazyIllustration: React.FC<LazyIllustrationProps> = ({ illustrationName, size = 512, ...rest }) => {\n const illustration = useMemo(() => lazyLoadIllustration(illustrationName, size), [illustrationName, size]);\n const isServerSide = useIsServerSide();\n\n if (isServerSide) {\n return null;\n }\n\n const fallback = (\n <svg\n data-testid={'fallback'}\n role={'presentation'}\n focusable={false}\n aria-hidden={true}\n viewBox=\"0 0 512 512\"\n style={{ minWidth: size, minHeight: size }}\n width={size}\n height={size}\n />\n );\n\n return (\n <ErrorBoundary fallback={fallback} reset={illustrationName}>\n <Suspense fallback={fallback}>\n <Illustration illustration={illustration} size={size} {...rest} />\n </Suspense>\n </ErrorBoundary>\n );\n};\n\nexport default LazyIllustration;\n","import LazyIllustration from './LazyIllustration';\nexport * from './LazyIllustration';\nexport default LazyIllustration;\n"],"mappings":";;;;;;;AAaA,MAAa,wBAAwB,kBAAoC,SAA6D;CACpI,MAAM,QAAQ,qBAAqB;CACnC,MAAM,uBAAuB,gBAAgB;EAAE;EAAM,GAAG;EAAO,CAAC;AAEhE,QAAO,WAAA,yCAAA;;;;;;;;;;;;;;;;;;;;;;;;;IAAmC,oBAAoB,qBAAqB,OAAA,EAAA,CAAO;;AAG5F,MAAaA,oBAAqD,EAAE,kBAAkB,OAAO,KAAK,GAAG,WAAW;CAC9G,MAAM,eAAe,cAAc,qBAAqB,kBAAkB,KAAK,EAAE,CAAC,kBAAkB,KAAK,CAAC;AAG1G,KAFqB,iBAAiB,CAGpC,QAAO;CAGT,MAAM,WACJ,oBAAC,OAAA;EACC,eAAa;EACb,MAAM;EACN,WAAW;EACX,eAAa;EACb,SAAQ;EACR,OAAO;GAAE,UAAU;GAAM,WAAW;GAAM;EAC1C,OAAO;EACP,QAAQ;GACR;AAGJ,QACE,oBAAC,uBAAA;EAAwB;EAAU,OAAO;YACxC,oBAAC,UAAA;GAAmB;aAClB,oBAAC,sBAAA;IAA2B;IAAoB;IAAM,GAAI;KAAQ;IACzD;GACG;;AC5CpB,IAAA,6BDgDe"}
|
package/lib/RadioButton.js
CHANGED
|
@@ -81,7 +81,7 @@ const RadioButton = React.forwardRef((props, ref) => {
|
|
|
81
81
|
"data-testid": testId,
|
|
82
82
|
"data-analyticsid": AnalyticsId.RadioButton,
|
|
83
83
|
className: radioButtonWrapperClasses,
|
|
84
|
-
children: renderLabelAsParent(label, getLabelContent(), inputId, onColor, radioButtonLabelClasses, void 0, radioButtonStyles["radiobutton-sublabel-wrapper"], isLarge)
|
|
84
|
+
children: renderLabelAsParent(label, getLabelContent(), inputId, onColor, radioButtonLabelClasses, void 0, radioButtonStyles["radiobutton-sublabel-wrapper"], isLarge, void 0, radioButtonStyles["radiobutton-afterlabelchildren-wrapper"])
|
|
85
85
|
})
|
|
86
86
|
});
|
|
87
87
|
});
|
package/lib/RadioButton.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RadioButton.js","names":[],"sources":["../src/components/RadioButton/RadioButton.tsx"],"sourcesContent":["import React, { useState } from 'react';\n\nimport classNames from 'classnames';\n\nimport { AnalyticsId, FormOnColor, FormSize } from '../../constants';\nimport { useIdWithFallback } from '../../hooks/useIdWithFallback';\nimport { usePseudoClasses } from '../../hooks/usePseudoClasses';\nimport { getAriaDescribedBy } from '../../utils/accessibility';\nimport { isMutableRefObject, mergeRefs } from '../../utils/refs';\nimport { uuid } from '../../utils/uuid';\nimport ErrorWrapper, { type ErrorWrapperClassNameProps } from '../ErrorWrapper';\nimport { getLabelText, renderLabelAsParent } from '../Label';\n\nimport radioButtonStyles from './styles.module.scss';\n\nexport interface RadioButtonProps\n extends\n ErrorWrapperClassNameProps,\n Pick<\n React.InputHTMLAttributes<HTMLInputElement>,\n 'aria-describedby' | 'name' | 'value' | 'disabled' | 'checked' | 'defaultChecked' | 'required' | 'onChange'\n > {\n /** Adds custom classes to the element. */\n className?: string;\n /** The <Label/> next to the radioButton - sublabels kan ikke kombineres med large variant */\n label: React.ReactNode;\n /** Adds custom classes to the label element. */\n labelClassNames?: string;\n /** input id of the radioButton */\n inputId?: string;\n /** Changes the visuals of the radioButton */\n onColor?: keyof typeof FormOnColor;\n /** Changes the visuals of the radioButton. Large version only works when used inside a FormGroup wrapper. */\n size?: keyof typeof FormSize;\n /** Activates Error style for the radioButton - This is can be true while errorText is empty, when in a FormGroup */\n error?: boolean;\n /** Error text to show above the component */\n errorText?: string;\n /** Error text id */\n errorTextId?: string;\n /** Sets the data-testid attribute. */\n testId?: string;\n}\n\nexport const getRadioLabelClasses = (\n radioId: string,\n onColor: FormOnColor,\n large: boolean,\n checkedRadioId?: string\n): string | undefined => {\n const onCherry = onColor === 'oninvalid';\n const checked = radioId === checkedRadioId;\n\n return classNames({\n [radioButtonStyles['radio-button-label__large--on-grey']]: large && onColor === 'ongrey' && !checked,\n [radioButtonStyles['radio-button-label__large--on-blueberry']]: onColor === 'onblueberry' && !checked && large,\n [radioButtonStyles['radio-button-label__large--selected']]: large && checked && !onCherry,\n [radioButtonStyles['radio-button-label__large--selected-invalid']]: large && checked && onCherry,\n });\n};\n\nexport const RadioButton = React.forwardRef((props: RadioButtonProps, ref: React.Ref<HTMLInputElement>) => {\n const {\n className,\n defaultChecked,\n onChange,\n disabled,\n label,\n inputId = uuid(),\n onColor = FormOnColor.onwhite,\n name = inputId,\n size,\n errorText,\n errorTextId: errorTextIdProp,\n error = !!errorText,\n errorWrapperClassName,\n value = getLabelText(label),\n testId,\n required,\n labelClassNames,\n ...rest\n } = props;\n const invalid = error || onColor === FormOnColor.oninvalid;\n const onDark = onColor === FormOnColor.ondark;\n const onBlueberry = onColor === FormOnColor.onblueberry;\n const onCherry = onColor === FormOnColor.oninvalid;\n const isLarge = size === FormSize.large;\n const [checked, changeChecked] = useState<boolean>();\n const { refObject, isFocused } = usePseudoClasses<HTMLInputElement>(isMutableRefObject(ref) ? ref : null);\n const mergedRefs = mergeRefs([ref, refObject]);\n const errorTextId = useIdWithFallback(errorTextIdProp);\n\n const radioButtonWrapperClasses = classNames(radioButtonStyles['radio-button-wrapper'], {\n [radioButtonStyles['radio-button-wrapper__large']]: isLarge,\n [radioButtonStyles['radio-button-wrapper__large--focused']]: isLarge && isFocused,\n [radioButtonStyles['radio-button-wrapper__large--selected']]: isLarge && checked && isFocused,\n [radioButtonStyles['radio-button-wrapper__large--invalid']]: isLarge && onCherry && isFocused,\n [radioButtonStyles['radio-button-wrapper__large--on-blueberry']]: isLarge && onBlueberry && isFocused,\n });\n const radioButtonLabelClasses = classNames(\n radioButtonStyles['radio-button-label'],\n {\n [radioButtonStyles['radio-button-label--disabled']]: disabled,\n [radioButtonStyles['radio-button-label--on-dark']]: onDark,\n [radioButtonStyles['radio-button-label--invalid']]: invalid,\n [radioButtonStyles['radio-button-label__large']]: isLarge,\n [radioButtonStyles['radio-button-label__large--focused']]: isFocused && isLarge,\n [radioButtonStyles['radio-button-label__large--disabled']]: isLarge && disabled,\n },\n labelClassNames\n );\n const radioButtonClasses = classNames(\n radioButtonStyles['radio-button'],\n {\n [radioButtonStyles['radio-button--on-dark']]: onDark,\n [radioButtonStyles['radio-button--disabled']]: disabled,\n [radioButtonStyles['radio-button--on-blueberry']]: onBlueberry,\n [radioButtonStyles['radio-button--invalid']]: invalid,\n [radioButtonStyles['radio-button__large']]: isLarge,\n [radioButtonStyles['radio-button__large--disabled']]: isLarge && disabled,\n [radioButtonStyles['radio-button__large--invalid']]: isLarge && invalid,\n },\n className\n );\n\n const change = (e: React.ChangeEvent<HTMLInputElement>): void => {\n changeChecked(e.target.checked);\n if (onChange) onChange(e);\n };\n\n const getLabelContent = (): React.ReactNode => (\n <input\n {...rest}\n id={inputId}\n name={name}\n className={radioButtonClasses}\n type=\"radio\"\n disabled={disabled}\n value={value}\n ref={mergedRefs}\n defaultChecked={defaultChecked}\n aria-describedby={getAriaDescribedBy(props, errorTextId)}\n required={required}\n onChange={(e): void => change(e)}\n />\n );\n\n return (\n <ErrorWrapper className={errorWrapperClassName} errorText={errorText} errorTextId={errorTextId}>\n <div data-testid={testId} data-analyticsid={AnalyticsId.RadioButton} className={radioButtonWrapperClasses}>\n {renderLabelAsParent(\n label,\n getLabelContent(),\n inputId,\n onColor as FormOnColor,\n radioButtonLabelClasses,\n undefined,\n radioButtonStyles['radiobutton-sublabel-wrapper'],\n isLarge\n )}\n </div>\n </ErrorWrapper>\n );\n});\n\nRadioButton.displayName = 'RadioButton';\n\nexport default RadioButton;\n"],"mappings":";;;;;;;;;;;;AA4CA,MAAa,wBACX,SACA,SACA,OACA,mBACuB;CACvB,MAAM,WAAW,YAAY;CAC7B,MAAM,UAAU,YAAY;AAE5B,QAAO,WAAW;GACf,kBAAkB,wCAAwC,SAAS,YAAY,YAAY,CAAC;GAC5F,kBAAkB,6CAA6C,YAAY,iBAAiB,CAAC,WAAW;GACxG,kBAAkB,yCAAyC,SAAS,WAAW,CAAC;GAChF,kBAAkB,iDAAiD,SAAS,WAAW;EACzF,CAAC;;AAGJ,MAAa,cAAc,MAAM,YAAY,OAAyB,QAAqC;CACzG,MAAM,EACJ,WACA,gBACA,UACA,UACA,OACA,UAAU,MAAM,EAChB,UAAU,YAAY,SACtB,OAAO,SACP,MACA,WACA,aAAa,iBACb,QAAQ,CAAC,CAAC,WACV,uBACA,QAAQ,aAAa,MAAM,EAC3B,QACA,UACA,iBACA,GAAG,SACD;CACJ,MAAM,UAAU,SAAS,YAAY,YAAY;CACjD,MAAM,SAAS,YAAY,YAAY;CACvC,MAAM,cAAc,YAAY,YAAY;CAC5C,MAAM,WAAW,YAAY,YAAY;CACzC,MAAM,UAAU,SAAS,SAAS;CAClC,MAAM,CAAC,SAAS,iBAAiB,UAAmB;CACpD,MAAM,EAAE,WAAW,cAAc,iBAAmC,mBAAmB,IAAI,GAAG,MAAM,KAAK;CACzG,MAAM,aAAa,UAAU,CAAC,KAAK,UAAU,CAAC;CAC9C,MAAM,cAAc,kBAAkB,gBAAgB;CAEtD,MAAM,4BAA4B,WAAW,kBAAkB,yBAAyB;GACrF,kBAAkB,iCAAiC;GACnD,kBAAkB,0CAA0C,WAAW;GACvE,kBAAkB,2CAA2C,WAAW,WAAW;GACnF,kBAAkB,0CAA0C,WAAW,YAAY;GACnF,kBAAkB,+CAA+C,WAAW,eAAe;EAC7F,CAAC;CACF,MAAM,0BAA0B,WAC9B,kBAAkB,uBAClB;GACG,kBAAkB,kCAAkC;GACpD,kBAAkB,iCAAiC;GACnD,kBAAkB,iCAAiC;GACnD,kBAAkB,+BAA+B;GACjD,kBAAkB,wCAAwC,aAAa;GACvE,kBAAkB,yCAAyC,WAAW;EACxE,EACD,gBACD;CACD,MAAM,qBAAqB,WACzB,kBAAkB,iBAClB;GACG,kBAAkB,2BAA2B;GAC7C,kBAAkB,4BAA4B;GAC9C,kBAAkB,gCAAgC;GAClD,kBAAkB,2BAA2B;GAC7C,kBAAkB,yBAAyB;GAC3C,kBAAkB,mCAAmC,WAAW;GAChE,kBAAkB,kCAAkC,WAAW;EACjE,EACD,UACD;CAED,MAAM,UAAU,MAAiD;AAC/D,gBAAc,EAAE,OAAO,QAAQ;AAC/B,MAAI,SAAU,UAAS,EAAE;;CAG3B,MAAM,wBACJ,oBAAC,SAAA;EACC,GAAI;EACJ,IAAI;EACE;EACN,WAAW;EACX,MAAK;EACK;EACH;EACP,KAAK;EACW;EAChB,oBAAkB,mBAAmB,OAAO,YAAY;EAC9C;EACV,WAAW,MAAY,OAAO,EAAE;GAChC;AAGJ,QACE,oBAAC,sBAAA;EAAa,WAAW;EAAkC;EAAwB;YACjF,oBAAC,OAAA;GAAI,eAAa;GAAQ,oBAAkB,YAAY;GAAa,WAAW;aAC7E,oBACC,OACA,iBAAiB,EACjB,SACA,SACA,yBACA,KAAA,GACA,kBAAkB,iCAClB,
|
|
1
|
+
{"version":3,"file":"RadioButton.js","names":[],"sources":["../src/components/RadioButton/RadioButton.tsx"],"sourcesContent":["import React, { useState } from 'react';\n\nimport classNames from 'classnames';\n\nimport { AnalyticsId, FormOnColor, FormSize } from '../../constants';\nimport { useIdWithFallback } from '../../hooks/useIdWithFallback';\nimport { usePseudoClasses } from '../../hooks/usePseudoClasses';\nimport { getAriaDescribedBy } from '../../utils/accessibility';\nimport { isMutableRefObject, mergeRefs } from '../../utils/refs';\nimport { uuid } from '../../utils/uuid';\nimport ErrorWrapper, { type ErrorWrapperClassNameProps } from '../ErrorWrapper';\nimport { getLabelText, renderLabelAsParent } from '../Label';\n\nimport radioButtonStyles from './styles.module.scss';\n\nexport interface RadioButtonProps\n extends\n ErrorWrapperClassNameProps,\n Pick<\n React.InputHTMLAttributes<HTMLInputElement>,\n 'aria-describedby' | 'name' | 'value' | 'disabled' | 'checked' | 'defaultChecked' | 'required' | 'onChange'\n > {\n /** Adds custom classes to the element. */\n className?: string;\n /** The <Label/> next to the radioButton - sublabels kan ikke kombineres med large variant */\n label: React.ReactNode;\n /** Adds custom classes to the label element. */\n labelClassNames?: string;\n /** input id of the radioButton */\n inputId?: string;\n /** Changes the visuals of the radioButton */\n onColor?: keyof typeof FormOnColor;\n /** Changes the visuals of the radioButton. Large version only works when used inside a FormGroup wrapper. */\n size?: keyof typeof FormSize;\n /** Activates Error style for the radioButton - This is can be true while errorText is empty, when in a FormGroup */\n error?: boolean;\n /** Error text to show above the component */\n errorText?: string;\n /** Error text id */\n errorTextId?: string;\n /** Sets the data-testid attribute. */\n testId?: string;\n}\n\nexport const getRadioLabelClasses = (\n radioId: string,\n onColor: FormOnColor,\n large: boolean,\n checkedRadioId?: string\n): string | undefined => {\n const onCherry = onColor === 'oninvalid';\n const checked = radioId === checkedRadioId;\n\n return classNames({\n [radioButtonStyles['radio-button-label__large--on-grey']]: large && onColor === 'ongrey' && !checked,\n [radioButtonStyles['radio-button-label__large--on-blueberry']]: onColor === 'onblueberry' && !checked && large,\n [radioButtonStyles['radio-button-label__large--selected']]: large && checked && !onCherry,\n [radioButtonStyles['radio-button-label__large--selected-invalid']]: large && checked && onCherry,\n });\n};\n\nexport const RadioButton = React.forwardRef((props: RadioButtonProps, ref: React.Ref<HTMLInputElement>) => {\n const {\n className,\n defaultChecked,\n onChange,\n disabled,\n label,\n inputId = uuid(),\n onColor = FormOnColor.onwhite,\n name = inputId,\n size,\n errorText,\n errorTextId: errorTextIdProp,\n error = !!errorText,\n errorWrapperClassName,\n value = getLabelText(label),\n testId,\n required,\n labelClassNames,\n ...rest\n } = props;\n const invalid = error || onColor === FormOnColor.oninvalid;\n const onDark = onColor === FormOnColor.ondark;\n const onBlueberry = onColor === FormOnColor.onblueberry;\n const onCherry = onColor === FormOnColor.oninvalid;\n const isLarge = size === FormSize.large;\n const [checked, changeChecked] = useState<boolean>();\n const { refObject, isFocused } = usePseudoClasses<HTMLInputElement>(isMutableRefObject(ref) ? ref : null);\n const mergedRefs = mergeRefs([ref, refObject]);\n const errorTextId = useIdWithFallback(errorTextIdProp);\n\n const radioButtonWrapperClasses = classNames(radioButtonStyles['radio-button-wrapper'], {\n [radioButtonStyles['radio-button-wrapper__large']]: isLarge,\n [radioButtonStyles['radio-button-wrapper__large--focused']]: isLarge && isFocused,\n [radioButtonStyles['radio-button-wrapper__large--selected']]: isLarge && checked && isFocused,\n [radioButtonStyles['radio-button-wrapper__large--invalid']]: isLarge && onCherry && isFocused,\n [radioButtonStyles['radio-button-wrapper__large--on-blueberry']]: isLarge && onBlueberry && isFocused,\n });\n const radioButtonLabelClasses = classNames(\n radioButtonStyles['radio-button-label'],\n {\n [radioButtonStyles['radio-button-label--disabled']]: disabled,\n [radioButtonStyles['radio-button-label--on-dark']]: onDark,\n [radioButtonStyles['radio-button-label--invalid']]: invalid,\n [radioButtonStyles['radio-button-label__large']]: isLarge,\n [radioButtonStyles['radio-button-label__large--focused']]: isFocused && isLarge,\n [radioButtonStyles['radio-button-label__large--disabled']]: isLarge && disabled,\n },\n labelClassNames\n );\n const radioButtonClasses = classNames(\n radioButtonStyles['radio-button'],\n {\n [radioButtonStyles['radio-button--on-dark']]: onDark,\n [radioButtonStyles['radio-button--disabled']]: disabled,\n [radioButtonStyles['radio-button--on-blueberry']]: onBlueberry,\n [radioButtonStyles['radio-button--invalid']]: invalid,\n [radioButtonStyles['radio-button__large']]: isLarge,\n [radioButtonStyles['radio-button__large--disabled']]: isLarge && disabled,\n [radioButtonStyles['radio-button__large--invalid']]: isLarge && invalid,\n },\n className\n );\n\n const change = (e: React.ChangeEvent<HTMLInputElement>): void => {\n changeChecked(e.target.checked);\n if (onChange) onChange(e);\n };\n\n const getLabelContent = (): React.ReactNode => (\n <input\n {...rest}\n id={inputId}\n name={name}\n className={radioButtonClasses}\n type=\"radio\"\n disabled={disabled}\n value={value}\n ref={mergedRefs}\n defaultChecked={defaultChecked}\n aria-describedby={getAriaDescribedBy(props, errorTextId)}\n required={required}\n onChange={(e): void => change(e)}\n />\n );\n\n return (\n <ErrorWrapper className={errorWrapperClassName} errorText={errorText} errorTextId={errorTextId}>\n <div data-testid={testId} data-analyticsid={AnalyticsId.RadioButton} className={radioButtonWrapperClasses}>\n {renderLabelAsParent(\n label,\n getLabelContent(),\n inputId,\n onColor as FormOnColor,\n radioButtonLabelClasses,\n undefined,\n radioButtonStyles['radiobutton-sublabel-wrapper'],\n isLarge,\n undefined,\n radioButtonStyles['radiobutton-afterlabelchildren-wrapper']\n )}\n </div>\n </ErrorWrapper>\n );\n});\n\nRadioButton.displayName = 'RadioButton';\n\nexport default RadioButton;\n"],"mappings":";;;;;;;;;;;;AA4CA,MAAa,wBACX,SACA,SACA,OACA,mBACuB;CACvB,MAAM,WAAW,YAAY;CAC7B,MAAM,UAAU,YAAY;AAE5B,QAAO,WAAW;GACf,kBAAkB,wCAAwC,SAAS,YAAY,YAAY,CAAC;GAC5F,kBAAkB,6CAA6C,YAAY,iBAAiB,CAAC,WAAW;GACxG,kBAAkB,yCAAyC,SAAS,WAAW,CAAC;GAChF,kBAAkB,iDAAiD,SAAS,WAAW;EACzF,CAAC;;AAGJ,MAAa,cAAc,MAAM,YAAY,OAAyB,QAAqC;CACzG,MAAM,EACJ,WACA,gBACA,UACA,UACA,OACA,UAAU,MAAM,EAChB,UAAU,YAAY,SACtB,OAAO,SACP,MACA,WACA,aAAa,iBACb,QAAQ,CAAC,CAAC,WACV,uBACA,QAAQ,aAAa,MAAM,EAC3B,QACA,UACA,iBACA,GAAG,SACD;CACJ,MAAM,UAAU,SAAS,YAAY,YAAY;CACjD,MAAM,SAAS,YAAY,YAAY;CACvC,MAAM,cAAc,YAAY,YAAY;CAC5C,MAAM,WAAW,YAAY,YAAY;CACzC,MAAM,UAAU,SAAS,SAAS;CAClC,MAAM,CAAC,SAAS,iBAAiB,UAAmB;CACpD,MAAM,EAAE,WAAW,cAAc,iBAAmC,mBAAmB,IAAI,GAAG,MAAM,KAAK;CACzG,MAAM,aAAa,UAAU,CAAC,KAAK,UAAU,CAAC;CAC9C,MAAM,cAAc,kBAAkB,gBAAgB;CAEtD,MAAM,4BAA4B,WAAW,kBAAkB,yBAAyB;GACrF,kBAAkB,iCAAiC;GACnD,kBAAkB,0CAA0C,WAAW;GACvE,kBAAkB,2CAA2C,WAAW,WAAW;GACnF,kBAAkB,0CAA0C,WAAW,YAAY;GACnF,kBAAkB,+CAA+C,WAAW,eAAe;EAC7F,CAAC;CACF,MAAM,0BAA0B,WAC9B,kBAAkB,uBAClB;GACG,kBAAkB,kCAAkC;GACpD,kBAAkB,iCAAiC;GACnD,kBAAkB,iCAAiC;GACnD,kBAAkB,+BAA+B;GACjD,kBAAkB,wCAAwC,aAAa;GACvE,kBAAkB,yCAAyC,WAAW;EACxE,EACD,gBACD;CACD,MAAM,qBAAqB,WACzB,kBAAkB,iBAClB;GACG,kBAAkB,2BAA2B;GAC7C,kBAAkB,4BAA4B;GAC9C,kBAAkB,gCAAgC;GAClD,kBAAkB,2BAA2B;GAC7C,kBAAkB,yBAAyB;GAC3C,kBAAkB,mCAAmC,WAAW;GAChE,kBAAkB,kCAAkC,WAAW;EACjE,EACD,UACD;CAED,MAAM,UAAU,MAAiD;AAC/D,gBAAc,EAAE,OAAO,QAAQ;AAC/B,MAAI,SAAU,UAAS,EAAE;;CAG3B,MAAM,wBACJ,oBAAC,SAAA;EACC,GAAI;EACJ,IAAI;EACE;EACN,WAAW;EACX,MAAK;EACK;EACH;EACP,KAAK;EACW;EAChB,oBAAkB,mBAAmB,OAAO,YAAY;EAC9C;EACV,WAAW,MAAY,OAAO,EAAE;GAChC;AAGJ,QACE,oBAAC,sBAAA;EAAa,WAAW;EAAkC;EAAwB;YACjF,oBAAC,OAAA;GAAI,eAAa;GAAQ,oBAAkB,YAAY;GAAa,WAAW;aAC7E,oBACC,OACA,iBAAiB,EACjB,SACA,SACA,yBACA,KAAA,GACA,kBAAkB,iCAClB,SACA,KAAA,GACA,kBAAkB,0CACnB;IACG;GACO;EAEjB;AAEF,YAAY,cAAc;AAE1B,IAAA,sBAAe"}
|
|
@@ -0,0 +1,96 @@
|
|
|
1
|
+
import { r as ViewBoxSize } from "./Illustration.js";
|
|
2
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
+
var StorkMedium = ({ color, svgProperties, title }) => {
|
|
4
|
+
const palette = (() => {
|
|
5
|
+
switch (color) {
|
|
6
|
+
case "blueberry": return {
|
|
7
|
+
lines: "#000",
|
|
8
|
+
stork: "#E4F7F9",
|
|
9
|
+
blob: "#CAE7ED",
|
|
10
|
+
beak: "#126F87",
|
|
11
|
+
bag: "#FFF"
|
|
12
|
+
};
|
|
13
|
+
case "cherry": return {
|
|
14
|
+
lines: "#1D1C1A",
|
|
15
|
+
stork: "#FFF2EA",
|
|
16
|
+
blob: "#F7E6DA",
|
|
17
|
+
beak: "#C73727",
|
|
18
|
+
bag: "#FFF"
|
|
19
|
+
};
|
|
20
|
+
default: return {
|
|
21
|
+
lines: "#1D1C1A",
|
|
22
|
+
stork: "#F5F3F3",
|
|
23
|
+
blob: "#EAE7E7",
|
|
24
|
+
beak: "#62625F",
|
|
25
|
+
bag: "#FFF"
|
|
26
|
+
};
|
|
27
|
+
}
|
|
28
|
+
})();
|
|
29
|
+
return /* @__PURE__ */ jsxs("svg", {
|
|
30
|
+
...svgProperties,
|
|
31
|
+
viewBox: ViewBoxSize.Medium,
|
|
32
|
+
children: [
|
|
33
|
+
title,
|
|
34
|
+
/* @__PURE__ */ jsx("path", {
|
|
35
|
+
d: "M182.472 132.175c35.52-23.612 64.972-7.746 81.79 7.201 27.014 24.02 25.642 70.676 79.08 88.618 34.533 11.59 54.981 61.445 45.148 95.24-7.519 25.869-42.324 72.185-113.306 38.741-49.446-23.306-94.334-15.424-130.931-56.274-29.055-32.435-44.501-118.534 38.219-173.526Z",
|
|
36
|
+
fill: palette.blob
|
|
37
|
+
}),
|
|
38
|
+
/* @__PURE__ */ jsx("path", {
|
|
39
|
+
d: "m348.82 244.041-8.234-28.318-14.312-33.842-13.802-27.921-5.681-5.648-14.142 27.922-15.651 37.901-11.17 42.585-1.554 27.105 6.317 16.818 14.414 15.22 14.153 4.003 11.477 1.304 15.945-4.015 11.818-7.972 7.745-9.606 4.956-11.488 1.078-18.418-3.357-25.63Zm-31.46 7.473-4.899 3.595-8.505 1.611-6.272-6.204-1.463-8.97 1.939-30.394 5.194-26.742 4.979-18.837 9.027 36.257 2.62 20.913.318 22.885-2.938 5.886Zm-7.904-107.361s-4.185-18.384 2.994-19.393c7.179-1.009 7.133 5.671 7.133 5.671l-1.984 12.225s7.802-7.372 11.545-6.124c3.742 1.247 4.457 5.772 4.457 5.772l-2.235 4.412-14.765 4.786-7.134-7.36-.011.011Z",
|
|
40
|
+
fill: palette.bag
|
|
41
|
+
}),
|
|
42
|
+
/* @__PURE__ */ jsx("path", {
|
|
43
|
+
d: "m258.842 101.586 47.949 46.724-2.325 3.198-53.881-41.564 8.257-8.358Zm-17.658 48.133s14.074 56.25 14.074 58.144c0 1.894 2.54 27.581 2.54 27.581l-1.803 17.828-9.504 20.278-17.839 19.007-12.044 5.285-15.424 4.65h-17.828l-12.168-3.38s109.802-.635 69.996-149.393Z",
|
|
44
|
+
fill: palette.beak
|
|
45
|
+
}),
|
|
46
|
+
/* @__PURE__ */ jsx("path", {
|
|
47
|
+
d: "M308.231 322.869c-25.166 0-45.647-20.482-45.647-45.647-.817-54.119 43.106-127.653 43.549-128.39a1.7 1.7 0 0 1 2.336-.578 1.7 1.7 0 0 1 .578 2.336c-.442.726-43.866 73.443-43.061 126.609 0 23.317 18.951 42.268 42.245 42.268 23.294 0 42.244-18.951 42.244-42.245 0-44.354-20.674-84.954-33.024-109.224-2.711-5.33-5.058-9.923-6.544-13.371a1.693 1.693 0 0 1 .896-2.234 1.693 1.693 0 0 1 2.234.896c1.441 3.346 3.765 7.905 6.442 13.178 12.486 24.53 33.399 65.596 33.399 110.766 0 25.166-20.482 45.647-45.647 45.647v-.011Z",
|
|
48
|
+
fill: palette.lines
|
|
49
|
+
}),
|
|
50
|
+
/* @__PURE__ */ jsx("path", {
|
|
51
|
+
d: "M308.333 258.418c-7.655 0-13.87-6.226-13.87-13.87 0-44.853 11.5-81.303 11.613-81.665a1.706 1.706 0 0 1 1.622-1.18h.023c.748 0 1.395.499 1.61 1.214 12.883 43.526 12.883 62.034 12.883 81.631 0 7.655-6.226 13.87-13.869 13.87h-.012Zm-.624-88.867c-3.152 11.829-9.843 40.952-9.843 74.986 0 5.772 4.695 10.467 10.467 10.467 5.773 0 10.468-4.695 10.468-10.467 0-18.474 0-35.962-11.092-74.986Z",
|
|
52
|
+
fill: palette.lines
|
|
53
|
+
}),
|
|
54
|
+
/* @__PURE__ */ jsx("path", {
|
|
55
|
+
d: "m246.805 67.852 8.747 1.593 8.945 7.155 3.578 9.342v6.361l-17.095 17.294-9.542 1.59-3.777 4.771v8.945l1.392 14.113 3.379 17.095 10.337 38.96 3.18 17.294 2.187 15.107-1.193 19.083-4.174 16.499-6.958 12.324-10.137 11.728-13.716 9.143-15.704 4.97-18.287 2.385c-3.777-.729-11.609-2.226-12.722-2.385-1.113-.159-10.933-4.307-15.703-6.361l-28.625-19.48 5.566-13.517 5.566-9.541 7.752-10.536 11.927-9.541 11.132-9.144 12.92-12.722 16.101-17.492 7.156-10.535 7.952-14.313 4.969-11.926 3.578-20.673V82.96l3.578-6.36 6.56-5.566 11.131-3.182Z",
|
|
56
|
+
fill: palette.stork
|
|
57
|
+
}),
|
|
58
|
+
/* @__PURE__ */ jsx("path", {
|
|
59
|
+
d: "M191.295 304.669a68.073 68.073 0 0 1-44.796-16.785l-17.851-7.462a1.7 1.7 0 0 1-.93-2.189c11.443-29.055 21.242-37.47 31.619-46.384l.907-.783c3.391-2.914 6.6-5.67 9.651-8.278 37.251-31.944 55.374-64.379 54.368-97.305-.295-9.731-.669-21.831-.669-36.472 0-12.69 10.32-23.011 23.011-23.011 12.69 0 23.01 10.32 23.01 23.01a23.16 23.16 0 0 1-.238 3.335 1.702 1.702 0 1 1-3.368-.488c.136-.93.204-1.882.204-2.846 0-10.82-8.801-19.609-19.608-19.609-10.808 0-19.609 8.8-19.609 19.609 0 14.584.375 26.662.669 36.37 1.044 34.015-17.472 67.346-55.547 99.992-3.051 2.62-6.26 5.364-9.651 8.279l-.908.783c-10.286 8.834-19.2 16.489-30.053 43.503l16.558 6.929c.17.068.329.171.465.295a64.685 64.685 0 0 0 42.766 16.127c35.713 0 64.768-29.055 64.768-64.768.692-19.109-5.886-44.592-11.692-67.07-6.839-26.481-12.736-49.344-6.011-57.555 1.928-2.347 4.718-3.447 8.347-3.254 1.134 0 2.37-.114 3.572-.341a1.698 1.698 0 0 1 1.985 1.361 1.7 1.7 0 0 1-1.361 1.985 23.54 23.54 0 0 1-4.287.397c-2.597-.147-4.4.522-5.625 2.007-5.625 6.873.352 30.031 6.68 54.55 5.863 22.704 12.497 48.448 11.794 67.988 0 37.527-30.575 68.114-68.17 68.114v-.034Z",
|
|
60
|
+
fill: palette.lines
|
|
61
|
+
}),
|
|
62
|
+
/* @__PURE__ */ jsx("path", {
|
|
63
|
+
d: "M131.189 273.196c-7.53 18.315-7.576 34.76 1.622 43.957l87.2-87.2-88.822 43.243Z",
|
|
64
|
+
fill: palette.lines
|
|
65
|
+
}),
|
|
66
|
+
/* @__PURE__ */ jsx("path", {
|
|
67
|
+
d: "M132.811 318.854c-.431 0-.874-.17-1.202-.499-9.379-9.379-10.105-26.073-1.997-45.806.159-.386.454-.703.828-.885l88.822-43.242a1.702 1.702 0 0 1 1.951 2.733l-87.2 87.2a1.71 1.71 0 0 1-1.202.499Zm-.295-44.411c-6.952 17.249-6.805 31.766.34 40.249l78.774-78.774-79.114 38.525Zm201.402-97.672c-.374 0-.748-.125-1.066-.374l-18.463-14.766a1.71 1.71 0 0 1-.272-2.393 1.71 1.71 0 0 1 2.393-.272l6.521 5.217-55.275-69.111-13.836 13.835 52.655 42.109c.738.59.851 1.656.273 2.393a1.71 1.71 0 0 1-2.393.272l-54.142-43.299a1.706 1.706 0 0 1-.635-1.236 1.707 1.707 0 0 1 .499-1.293l16.524-16.524c.34-.34.816-.522 1.293-.499a1.7 1.7 0 0 1 1.236.635l66.015 82.539a1.701 1.701 0 0 1-1.327 2.767ZM198.531 432.613c-.93 0-1.679-.737-1.701-1.667l-2.665-153.93a1.714 1.714 0 0 1 1.667-1.735c.941 0 1.712.737 1.735 1.667l2.665 153.93a1.714 1.714 0 0 1-1.667 1.735h-.034Z",
|
|
68
|
+
fill: palette.lines
|
|
69
|
+
}),
|
|
70
|
+
/* @__PURE__ */ jsx("path", {
|
|
71
|
+
d: "m198.53 431.212 27.06-4.196s-7.587 3.787 1.825 8.585c0 0-11.045.442-3.288 9.231 0 0-15.118-7.632-25.585-13.62h-.012Z",
|
|
72
|
+
fill: palette.lines
|
|
73
|
+
}),
|
|
74
|
+
/* @__PURE__ */ jsx("path", {
|
|
75
|
+
d: "M224.105 446.52c-.261 0-.522-.057-.76-.181-.148-.08-15.276-7.712-25.665-13.655a1.707 1.707 0 0 1-.827-1.792 1.713 1.713 0 0 1 1.417-1.372l27.059-4.196a1.707 1.707 0 0 1 1.883 1.168 1.715 1.715 0 0 1-.862 2.042c-.601.306-1.95 1.292-1.95 2.154 0 .341.272 1.599 3.776 3.391a1.692 1.692 0 0 1 .885 1.883 1.705 1.705 0 0 1-1.6 1.338c-1.474.068-3.867.669-4.332 1.747-.385.895.454 2.631 2.246 4.661.544.612.567 1.519.068 2.166a1.697 1.697 0 0 1-1.35.658l.012-.012Zm-20.448-14.391c5.67 3.13 11.897 6.384 16.127 8.562-.238-1.077-.159-2.087.238-3.005.612-1.418 1.837-2.314 3.13-2.87-1.452-1.292-2.155-2.665-2.155-4.162 0-.442.068-.862.193-1.259l-17.522 2.711-.011.023Zm23.045-36.699s16.115 2.846 23.158 11.465c0 0-11.489-4.445-6.521 6.998 0 0-9.776-8.767-11.08 2.676l-5.557-21.139Z",
|
|
76
|
+
fill: palette.lines
|
|
77
|
+
}),
|
|
78
|
+
/* @__PURE__ */ jsx("path", {
|
|
79
|
+
d: "M232.27 418.272a1.698 1.698 0 0 1-1.645-1.27l-5.557-21.139c-.147-.567 0-1.157.397-1.588a1.684 1.684 0 0 1 1.542-.522c.681.125 16.819 3.051 24.179 12.067.488.601.511 1.452.057 2.075a1.718 1.718 0 0 1-1.996.59c-1.645-.635-4.434-1.111-5.171-.34-.454.476-.477 2.064.827 5.069.318.737.08 1.588-.567 2.053a1.708 1.708 0 0 1-2.132-.113c-1.293-1.157-4.536-3.323-6.305-2.654-1.327.51-1.792 2.88-1.951 4.253a1.706 1.706 0 0 1-1.565 1.508h-.125l.012.011Zm-3.21-20.572 3.47 13.201c.602-.726 1.316-1.248 2.167-1.565 1.894-.726 3.98-.204 5.738.612-.181-1.769.216-3.141 1.191-4.151.816-.85 1.905-1.258 3.028-1.395-5.137-3.697-11.919-5.772-15.594-6.691v-.011Z",
|
|
80
|
+
fill: palette.lines
|
|
81
|
+
}),
|
|
82
|
+
/* @__PURE__ */ jsx("path", {
|
|
83
|
+
d: "M226.701 397.128c-.419 0-.839-.148-1.168-.465l-58.961-55.31a1.692 1.692 0 0 1-.34-2.03l19.302-36.619a1.718 1.718 0 0 1 2.302-.715 1.715 1.715 0 0 1 .715 2.302l-18.701 35.475 58.019 54.424c.681.647.715 1.724.08 2.405a1.695 1.695 0 0 1-1.236.533h-.012Zm28.591-306.994a1.7 1.7 0 0 1-1.702-1.701 5.78 5.78 0 0 0-5.772-5.773 5.774 5.774 0 0 0-5.773 5.773c0 .94-.76 1.7-1.701 1.7-.941 0-1.701-.76-1.701-1.7 0-5.059 4.117-9.175 9.175-9.175 5.058 0 9.175 4.117 9.175 9.175 0 .94-.76 1.7-1.701 1.7Zm77.515 85.238c-.431 0-.851-.159-1.191-.488l-73.954-72.082a1.7 1.7 0 0 1 2.37-2.438l73.954 72.082a1.7 1.7 0 0 1 .034 2.404 1.68 1.68 0 0 1-1.213.511v.011Zm-20.289-25.357c-.329 0-.658-.09-.953-.294a1.71 1.71 0 0 1-.453-2.359c5.852-8.608 6.691-16.274 6.759-16.989a3.977 3.977 0 0 0-3.97-3.913c-2.166 0-3.969 1.781-3.969 3.97 0 .068-.057 4.479 1.27 13.87a1.691 1.691 0 0 1-1.451 1.916 1.694 1.694 0 0 1-1.917-1.451c-1.361-9.708-1.304-14.188-1.304-14.369 0-4.038 3.311-7.349 7.371-7.349 4.06 0 7.372 3.311 7.372 7.371v.114c-.023.363-.669 8.914-7.338 18.724a1.689 1.689 0 0 1-1.406.748l-.011.011Z",
|
|
84
|
+
fill: palette.lines
|
|
85
|
+
}),
|
|
86
|
+
/* @__PURE__ */ jsx("path", {
|
|
87
|
+
d: "M315.285 153.473a1.707 1.707 0 0 1-1.667-1.383 1.709 1.709 0 0 1 1.349-1.996c9.379-1.815 14.642-4.389 15.458-4.809a3.972 3.972 0 0 0 .646-5.489 3.997 3.997 0 0 0-2.631-1.531 3.958 3.958 0 0 0-2.937.783c-.125.091-.249.17-.385.227-.023 0-3.561 1.565-10.003 8.086a1.69 1.69 0 0 1-2.404.011 1.69 1.69 0 0 1-.012-2.404c6.17-6.26 9.969-8.29 10.91-8.744 3.221-2.325 7.746-1.667 10.173 1.508 2.472 3.232 1.849 7.871-1.384 10.343-.068.045-.136.102-.215.136-.227.125-5.795 3.142-16.569 5.228a1.605 1.605 0 0 1-.329.034Z",
|
|
88
|
+
fill: palette.lines
|
|
89
|
+
})
|
|
90
|
+
]
|
|
91
|
+
});
|
|
92
|
+
};
|
|
93
|
+
var StorkMedium_default = StorkMedium;
|
|
94
|
+
export { StorkMedium_default as t };
|
|
95
|
+
|
|
96
|
+
//# sourceMappingURL=StorkMedium.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"StorkMedium.js","names":["StorkMedium: React.FC<BaseSvgIllustrationProps>"],"sources":["../src/components/Illustrations/StorkMedium.tsx"],"sourcesContent":["import type React from 'react';\n\nimport type { Palette } from './Stork';\n\nimport { type BaseSvgIllustrationProps, ViewBoxSize } from '../Illustration';\n\nconst StorkMedium: React.FC<BaseSvgIllustrationProps> = ({ color, svgProperties, title }) => {\n const palette = ((): Palette => {\n switch (color) {\n case 'blueberry':\n return {\n lines: '#000',\n stork: '#E4F7F9',\n blob: '#CAE7ED',\n beak: '#126F87',\n bag: '#FFF',\n };\n case 'cherry':\n return {\n lines: '#1D1C1A',\n stork: '#FFF2EA',\n blob: '#F7E6DA',\n beak: '#C73727',\n bag: '#FFF',\n };\n default:\n return {\n lines: '#1D1C1A',\n stork: '#F5F3F3',\n blob: '#EAE7E7',\n beak: '#62625F',\n bag: '#FFF',\n };\n }\n })();\n\n return (\n <svg {...svgProperties} viewBox={ViewBoxSize.Medium}>\n {title}\n <path\n d=\"M182.472 132.175c35.52-23.612 64.972-7.746 81.79 7.201 27.014 24.02 25.642 70.676 79.08 88.618 34.533 11.59 54.981 61.445 45.148 95.24-7.519 25.869-42.324 72.185-113.306 38.741-49.446-23.306-94.334-15.424-130.931-56.274-29.055-32.435-44.501-118.534 38.219-173.526Z\"\n fill={palette.blob}\n />\n <path\n d=\"m348.82 244.041-8.234-28.318-14.312-33.842-13.802-27.921-5.681-5.648-14.142 27.922-15.651 37.901-11.17 42.585-1.554 27.105 6.317 16.818 14.414 15.22 14.153 4.003 11.477 1.304 15.945-4.015 11.818-7.972 7.745-9.606 4.956-11.488 1.078-18.418-3.357-25.63Zm-31.46 7.473-4.899 3.595-8.505 1.611-6.272-6.204-1.463-8.97 1.939-30.394 5.194-26.742 4.979-18.837 9.027 36.257 2.62 20.913.318 22.885-2.938 5.886Zm-7.904-107.361s-4.185-18.384 2.994-19.393c7.179-1.009 7.133 5.671 7.133 5.671l-1.984 12.225s7.802-7.372 11.545-6.124c3.742 1.247 4.457 5.772 4.457 5.772l-2.235 4.412-14.765 4.786-7.134-7.36-.011.011Z\"\n fill={palette.bag}\n />\n <path\n d=\"m258.842 101.586 47.949 46.724-2.325 3.198-53.881-41.564 8.257-8.358Zm-17.658 48.133s14.074 56.25 14.074 58.144c0 1.894 2.54 27.581 2.54 27.581l-1.803 17.828-9.504 20.278-17.839 19.007-12.044 5.285-15.424 4.65h-17.828l-12.168-3.38s109.802-.635 69.996-149.393Z\"\n fill={palette.beak}\n />\n <path\n d=\"M308.231 322.869c-25.166 0-45.647-20.482-45.647-45.647-.817-54.119 43.106-127.653 43.549-128.39a1.7 1.7 0 0 1 2.336-.578 1.7 1.7 0 0 1 .578 2.336c-.442.726-43.866 73.443-43.061 126.609 0 23.317 18.951 42.268 42.245 42.268 23.294 0 42.244-18.951 42.244-42.245 0-44.354-20.674-84.954-33.024-109.224-2.711-5.33-5.058-9.923-6.544-13.371a1.693 1.693 0 0 1 .896-2.234 1.693 1.693 0 0 1 2.234.896c1.441 3.346 3.765 7.905 6.442 13.178 12.486 24.53 33.399 65.596 33.399 110.766 0 25.166-20.482 45.647-45.647 45.647v-.011Z\"\n fill={palette.lines}\n />\n <path\n d=\"M308.333 258.418c-7.655 0-13.87-6.226-13.87-13.87 0-44.853 11.5-81.303 11.613-81.665a1.706 1.706 0 0 1 1.622-1.18h.023c.748 0 1.395.499 1.61 1.214 12.883 43.526 12.883 62.034 12.883 81.631 0 7.655-6.226 13.87-13.869 13.87h-.012Zm-.624-88.867c-3.152 11.829-9.843 40.952-9.843 74.986 0 5.772 4.695 10.467 10.467 10.467 5.773 0 10.468-4.695 10.468-10.467 0-18.474 0-35.962-11.092-74.986Z\"\n fill={palette.lines}\n />\n <path\n d=\"m246.805 67.852 8.747 1.593 8.945 7.155 3.578 9.342v6.361l-17.095 17.294-9.542 1.59-3.777 4.771v8.945l1.392 14.113 3.379 17.095 10.337 38.96 3.18 17.294 2.187 15.107-1.193 19.083-4.174 16.499-6.958 12.324-10.137 11.728-13.716 9.143-15.704 4.97-18.287 2.385c-3.777-.729-11.609-2.226-12.722-2.385-1.113-.159-10.933-4.307-15.703-6.361l-28.625-19.48 5.566-13.517 5.566-9.541 7.752-10.536 11.927-9.541 11.132-9.144 12.92-12.722 16.101-17.492 7.156-10.535 7.952-14.313 4.969-11.926 3.578-20.673V82.96l3.578-6.36 6.56-5.566 11.131-3.182Z\"\n fill={palette.stork}\n />\n <path\n d=\"M191.295 304.669a68.073 68.073 0 0 1-44.796-16.785l-17.851-7.462a1.7 1.7 0 0 1-.93-2.189c11.443-29.055 21.242-37.47 31.619-46.384l.907-.783c3.391-2.914 6.6-5.67 9.651-8.278 37.251-31.944 55.374-64.379 54.368-97.305-.295-9.731-.669-21.831-.669-36.472 0-12.69 10.32-23.011 23.011-23.011 12.69 0 23.01 10.32 23.01 23.01a23.16 23.16 0 0 1-.238 3.335 1.702 1.702 0 1 1-3.368-.488c.136-.93.204-1.882.204-2.846 0-10.82-8.801-19.609-19.608-19.609-10.808 0-19.609 8.8-19.609 19.609 0 14.584.375 26.662.669 36.37 1.044 34.015-17.472 67.346-55.547 99.992-3.051 2.62-6.26 5.364-9.651 8.279l-.908.783c-10.286 8.834-19.2 16.489-30.053 43.503l16.558 6.929c.17.068.329.171.465.295a64.685 64.685 0 0 0 42.766 16.127c35.713 0 64.768-29.055 64.768-64.768.692-19.109-5.886-44.592-11.692-67.07-6.839-26.481-12.736-49.344-6.011-57.555 1.928-2.347 4.718-3.447 8.347-3.254 1.134 0 2.37-.114 3.572-.341a1.698 1.698 0 0 1 1.985 1.361 1.7 1.7 0 0 1-1.361 1.985 23.54 23.54 0 0 1-4.287.397c-2.597-.147-4.4.522-5.625 2.007-5.625 6.873.352 30.031 6.68 54.55 5.863 22.704 12.497 48.448 11.794 67.988 0 37.527-30.575 68.114-68.17 68.114v-.034Z\"\n fill={palette.lines}\n />\n <path d=\"M131.189 273.196c-7.53 18.315-7.576 34.76 1.622 43.957l87.2-87.2-88.822 43.243Z\" fill={palette.lines} />\n <path\n d=\"M132.811 318.854c-.431 0-.874-.17-1.202-.499-9.379-9.379-10.105-26.073-1.997-45.806.159-.386.454-.703.828-.885l88.822-43.242a1.702 1.702 0 0 1 1.951 2.733l-87.2 87.2a1.71 1.71 0 0 1-1.202.499Zm-.295-44.411c-6.952 17.249-6.805 31.766.34 40.249l78.774-78.774-79.114 38.525Zm201.402-97.672c-.374 0-.748-.125-1.066-.374l-18.463-14.766a1.71 1.71 0 0 1-.272-2.393 1.71 1.71 0 0 1 2.393-.272l6.521 5.217-55.275-69.111-13.836 13.835 52.655 42.109c.738.59.851 1.656.273 2.393a1.71 1.71 0 0 1-2.393.272l-54.142-43.299a1.706 1.706 0 0 1-.635-1.236 1.707 1.707 0 0 1 .499-1.293l16.524-16.524c.34-.34.816-.522 1.293-.499a1.7 1.7 0 0 1 1.236.635l66.015 82.539a1.701 1.701 0 0 1-1.327 2.767ZM198.531 432.613c-.93 0-1.679-.737-1.701-1.667l-2.665-153.93a1.714 1.714 0 0 1 1.667-1.735c.941 0 1.712.737 1.735 1.667l2.665 153.93a1.714 1.714 0 0 1-1.667 1.735h-.034Z\"\n fill={palette.lines}\n />\n <path\n d=\"m198.53 431.212 27.06-4.196s-7.587 3.787 1.825 8.585c0 0-11.045.442-3.288 9.231 0 0-15.118-7.632-25.585-13.62h-.012Z\"\n fill={palette.lines}\n />\n <path\n d=\"M224.105 446.52c-.261 0-.522-.057-.76-.181-.148-.08-15.276-7.712-25.665-13.655a1.707 1.707 0 0 1-.827-1.792 1.713 1.713 0 0 1 1.417-1.372l27.059-4.196a1.707 1.707 0 0 1 1.883 1.168 1.715 1.715 0 0 1-.862 2.042c-.601.306-1.95 1.292-1.95 2.154 0 .341.272 1.599 3.776 3.391a1.692 1.692 0 0 1 .885 1.883 1.705 1.705 0 0 1-1.6 1.338c-1.474.068-3.867.669-4.332 1.747-.385.895.454 2.631 2.246 4.661.544.612.567 1.519.068 2.166a1.697 1.697 0 0 1-1.35.658l.012-.012Zm-20.448-14.391c5.67 3.13 11.897 6.384 16.127 8.562-.238-1.077-.159-2.087.238-3.005.612-1.418 1.837-2.314 3.13-2.87-1.452-1.292-2.155-2.665-2.155-4.162 0-.442.068-.862.193-1.259l-17.522 2.711-.011.023Zm23.045-36.699s16.115 2.846 23.158 11.465c0 0-11.489-4.445-6.521 6.998 0 0-9.776-8.767-11.08 2.676l-5.557-21.139Z\"\n fill={palette.lines}\n />\n <path\n d=\"M232.27 418.272a1.698 1.698 0 0 1-1.645-1.27l-5.557-21.139c-.147-.567 0-1.157.397-1.588a1.684 1.684 0 0 1 1.542-.522c.681.125 16.819 3.051 24.179 12.067.488.601.511 1.452.057 2.075a1.718 1.718 0 0 1-1.996.59c-1.645-.635-4.434-1.111-5.171-.34-.454.476-.477 2.064.827 5.069.318.737.08 1.588-.567 2.053a1.708 1.708 0 0 1-2.132-.113c-1.293-1.157-4.536-3.323-6.305-2.654-1.327.51-1.792 2.88-1.951 4.253a1.706 1.706 0 0 1-1.565 1.508h-.125l.012.011Zm-3.21-20.572 3.47 13.201c.602-.726 1.316-1.248 2.167-1.565 1.894-.726 3.98-.204 5.738.612-.181-1.769.216-3.141 1.191-4.151.816-.85 1.905-1.258 3.028-1.395-5.137-3.697-11.919-5.772-15.594-6.691v-.011Z\"\n fill={palette.lines}\n />\n <path\n d=\"M226.701 397.128c-.419 0-.839-.148-1.168-.465l-58.961-55.31a1.692 1.692 0 0 1-.34-2.03l19.302-36.619a1.718 1.718 0 0 1 2.302-.715 1.715 1.715 0 0 1 .715 2.302l-18.701 35.475 58.019 54.424c.681.647.715 1.724.08 2.405a1.695 1.695 0 0 1-1.236.533h-.012Zm28.591-306.994a1.7 1.7 0 0 1-1.702-1.701 5.78 5.78 0 0 0-5.772-5.773 5.774 5.774 0 0 0-5.773 5.773c0 .94-.76 1.7-1.701 1.7-.941 0-1.701-.76-1.701-1.7 0-5.059 4.117-9.175 9.175-9.175 5.058 0 9.175 4.117 9.175 9.175 0 .94-.76 1.7-1.701 1.7Zm77.515 85.238c-.431 0-.851-.159-1.191-.488l-73.954-72.082a1.7 1.7 0 0 1 2.37-2.438l73.954 72.082a1.7 1.7 0 0 1 .034 2.404 1.68 1.68 0 0 1-1.213.511v.011Zm-20.289-25.357c-.329 0-.658-.09-.953-.294a1.71 1.71 0 0 1-.453-2.359c5.852-8.608 6.691-16.274 6.759-16.989a3.977 3.977 0 0 0-3.97-3.913c-2.166 0-3.969 1.781-3.969 3.97 0 .068-.057 4.479 1.27 13.87a1.691 1.691 0 0 1-1.451 1.916 1.694 1.694 0 0 1-1.917-1.451c-1.361-9.708-1.304-14.188-1.304-14.369 0-4.038 3.311-7.349 7.371-7.349 4.06 0 7.372 3.311 7.372 7.371v.114c-.023.363-.669 8.914-7.338 18.724a1.689 1.689 0 0 1-1.406.748l-.011.011Z\"\n fill={palette.lines}\n />\n <path\n d=\"M315.285 153.473a1.707 1.707 0 0 1-1.667-1.383 1.709 1.709 0 0 1 1.349-1.996c9.379-1.815 14.642-4.389 15.458-4.809a3.972 3.972 0 0 0 .646-5.489 3.997 3.997 0 0 0-2.631-1.531 3.958 3.958 0 0 0-2.937.783c-.125.091-.249.17-.385.227-.023 0-3.561 1.565-10.003 8.086a1.69 1.69 0 0 1-2.404.011 1.69 1.69 0 0 1-.012-2.404c6.17-6.26 9.969-8.29 10.91-8.744 3.221-2.325 7.746-1.667 10.173 1.508 2.472 3.232 1.849 7.871-1.384 10.343-.068.045-.136.102-.215.136-.227.125-5.795 3.142-16.569 5.228a1.605 1.605 0 0 1-.329.034Z\"\n fill={palette.lines}\n />\n </svg>\n );\n};\n\nexport default StorkMedium;\n"],"mappings":";;AAMA,IAAMA,eAAmD,EAAE,OAAO,eAAe,YAAY;CAC3F,MAAM,iBAA0B;AAC9B,UAAQ,OAAR;GACE,KAAK,YACH,QAAO;IACL,OAAO;IACP,OAAO;IACP,MAAM;IACN,MAAM;IACN,KAAK;IACN;GACH,KAAK,SACH,QAAO;IACL,OAAO;IACP,OAAO;IACP,MAAM;IACN,MAAM;IACN,KAAK;IACN;GACH,QACE,QAAO;IACL,OAAO;IACP,OAAO;IACP,MAAM;IACN,MAAM;IACN,KAAK;IACN;;KAEH;AAEJ,QACE,qBAAC,OAAA;EAAI,GAAI;EAAe,SAAS,YAAY;;GAC1C;GACD,oBAAC,QAAA;IACC,GAAE;IACF,MAAM,QAAQ;KACd;GACF,oBAAC,QAAA;IACC,GAAE;IACF,MAAM,QAAQ;KACd;GACF,oBAAC,QAAA;IACC,GAAE;IACF,MAAM,QAAQ;KACd;GACF,oBAAC,QAAA;IACC,GAAE;IACF,MAAM,QAAQ;KACd;GACF,oBAAC,QAAA;IACC,GAAE;IACF,MAAM,QAAQ;KACd;GACF,oBAAC,QAAA;IACC,GAAE;IACF,MAAM,QAAQ;KACd;GACF,oBAAC,QAAA;IACC,GAAE;IACF,MAAM,QAAQ;KACd;GACF,oBAAC,QAAA;IAAK,GAAE;IAAkF,MAAM,QAAQ;KAAS;GACjH,oBAAC,QAAA;IACC,GAAE;IACF,MAAM,QAAQ;KACd;GACF,oBAAC,QAAA;IACC,GAAE;IACF,MAAM,QAAQ;KACd;GACF,oBAAC,QAAA;IACC,GAAE;IACF,MAAM,QAAQ;KACd;GACF,oBAAC,QAAA;IACC,GAAE;IACF,MAAM,QAAQ;KACd;GACF,oBAAC,QAAA;IACC,GAAE;IACF,MAAM,QAAQ;KACd;GACF,oBAAC,QAAA;IACC,GAAE;IACF,MAAM,QAAQ;KACd;;GACE;;AAIV,IAAA,sBAAe"}
|
|
@@ -0,0 +1,98 @@
|
|
|
1
|
+
import { r as ViewBoxSize } from "./Illustration.js";
|
|
2
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
+
var ThinkingMedium = ({ color, svgProperties, title }) => {
|
|
4
|
+
const palette = (() => {
|
|
5
|
+
switch (color) {
|
|
6
|
+
case "blueberry": return {
|
|
7
|
+
lines: "#000",
|
|
8
|
+
shapes1: "#188097",
|
|
9
|
+
shapes2: "#AFDAE3"
|
|
10
|
+
};
|
|
11
|
+
case "cherry": return {
|
|
12
|
+
lines: "#000",
|
|
13
|
+
shapes1: "#A31F0E",
|
|
14
|
+
shapes2: "#F05A3B"
|
|
15
|
+
};
|
|
16
|
+
default: return {
|
|
17
|
+
lines: "#1D1C1A",
|
|
18
|
+
shapes1: "#989693",
|
|
19
|
+
shapes2: "#D6D3D2"
|
|
20
|
+
};
|
|
21
|
+
}
|
|
22
|
+
})();
|
|
23
|
+
return /* @__PURE__ */ jsxs("svg", {
|
|
24
|
+
...svgProperties,
|
|
25
|
+
viewBox: ViewBoxSize.Medium,
|
|
26
|
+
children: [
|
|
27
|
+
title,
|
|
28
|
+
/* @__PURE__ */ jsx("path", {
|
|
29
|
+
d: "m301.601 134.422-11.125 19.26-11.115-19.26h22.24Z",
|
|
30
|
+
fill: palette.lines
|
|
31
|
+
}),
|
|
32
|
+
/* @__PURE__ */ jsx("path", {
|
|
33
|
+
d: "M215.7 117.402c6.645 0 12.033-5.387 12.033-12.033s-5.388-12.033-12.033-12.033c-6.646 0-12.033 5.387-12.033 12.033s5.387 12.033 12.033 12.033Z",
|
|
34
|
+
fill: palette.shapes2
|
|
35
|
+
}),
|
|
36
|
+
/* @__PURE__ */ jsx("path", {
|
|
37
|
+
d: "M352.636 188.933a543.85 543.85 0 0 1-15.73 3.395 116.773 116.773 0 0 0-4.179-9.625c-2.107-4.28-6.387-8.313-9.121-10.633l21.21-6.968 7.809 23.82.011.011ZM138.19 133.719l-15.753-14.487c-1.659-1.524-5.11-.448-7.72 2.386-2.611 2.835-3.373 6.375-1.726 7.899l15.753 14.487c1.659 1.524 5.11.448 7.72-2.386 2.611-2.835 3.373-6.376 1.726-7.899Z",
|
|
38
|
+
fill: palette.lines
|
|
39
|
+
}),
|
|
40
|
+
/* @__PURE__ */ jsx("path", {
|
|
41
|
+
d: "M120.712 127.141c2.608-2.839 3.38-6.372 1.726-7.892-1.655-1.519-5.109-.449-7.717 2.391-2.607 2.839-3.38 6.373-1.725 7.892 1.654 1.519 5.109.449 7.716-2.391Zm170.674-32.739-1.429 27.457 13.427.699 1.429-27.457-13.427-.7Zm45.811 97.869a586.22 586.22 0 0 1-11.417 2.196c-26.576 4.84-50.587 7.271-71.931 8.089 1.132-22.531 19.764-40.447 42.576-40.447 19.204 0 35.439 12.706 40.772 30.162Z",
|
|
42
|
+
fill: palette.shapes1
|
|
43
|
+
}),
|
|
44
|
+
/* @__PURE__ */ jsx("path", {
|
|
45
|
+
d: "m362.978 139.172 2.957 11.047-11.047-2.969 8.09-8.078Z",
|
|
46
|
+
fill: palette.shapes2
|
|
47
|
+
}),
|
|
48
|
+
/* @__PURE__ */ jsx("path", {
|
|
49
|
+
d: "M299.965 451.799c-.918 0-1.669-.74-1.68-1.658l-.874-66.329a1.679 1.679 0 0 1 1.658-1.703h.022c.919 0 1.67.74 1.681 1.659l.874 66.328a1.678 1.678 0 0 1-1.658 1.703h-.023Zm-91.784-142.302c-1.288 0-2.621-.269-4.022-.84-7.563-3.149-18.767-21.871-24.66-50.352-.964-4.672-.605-12.358 3.607-18.632 2.869-4.291 7.093-7.07 12.191-8.022 13.87-2.611 20.75 7.036 21.041 7.45a1.68 1.68 0 0 1-2.756 1.927c-.258-.358-6.006-8.268-17.658-6.072-4.258.807-7.63 3.025-10.017 6.588-3.394 5.075-4.011 11.731-3.103 16.089 4.807 23.215 14.969 44.716 22.666 47.92 3.26 1.367 7.607 1.21 15.036-10.252a1.68 1.68 0 0 1 2.319-.493c.784.504.997 1.546.493 2.331-4.078 6.285-8.974 12.369-15.126 12.369l-.011-.011Z",
|
|
50
|
+
fill: palette.lines
|
|
51
|
+
}),
|
|
52
|
+
/* @__PURE__ */ jsx("path", {
|
|
53
|
+
d: "M215.699 255.82c-.47 0-.941-.191-1.266-.583-.078-.09-7.977-9.087-15.17-9.087h-.056c-2.353.012-4.336 1.02-6.062 3.059a1.683 1.683 0 0 1-2.364.202 1.683 1.683 0 0 1-.201-2.364c2.364-2.801 5.266-4.235 8.616-4.258 8.784-.045 17.422 9.826 17.792 10.252a1.684 1.684 0 0 1-.168 2.375 1.64 1.64 0 0 1-1.098.415l-.023-.011Zm-7.697 36.301c-.28 0-.56-.067-.818-.213a1.686 1.686 0 0 1-.65-2.285c5.569-9.938.807-13.871-3.787-17.68-2.521-2.084-4.907-4.056-4.661-6.902.225-2.667 2.712-5.176 8.325-8.403a1.681 1.681 0 1 1 1.681 2.913c-5.636 3.238-6.588 5.008-6.656 5.781-.089 1.098 1.625 2.521 3.451 4.034 4.583 3.787 11.518 9.523 4.583 21.915a1.673 1.673 0 0 1-1.468.863v-.023Zm-62.989-99.709c-.717 0-1.389-.47-1.614-1.198a10.523 10.523 0 0 1-.28-1.166c-.874-5.131 2.588-10.005 7.72-10.879a9.398 9.398 0 0 1 7.742 2.151 1.686 1.686 0 0 1-2.196 2.555 6.06 6.06 0 0 0-4.986-1.389c-3.305.56-5.535 3.708-4.963 7.002.045.258.101.516.179.751a1.683 1.683 0 0 1-1.12 2.095 1.8 1.8 0 0 1-.493.067l.011.011Zm128.276-75.598c-4.583 0-8.314-3.731-8.314-8.313 0-4.583 3.731-8.313 8.314-8.313 4.582 0 8.313 3.73 8.313 8.313 0 4.582-3.731 8.313-8.313 8.313Zm0-13.276a4.954 4.954 0 0 0-4.953 4.952 4.954 4.954 0 0 0 4.953 4.952 4.954 4.954 0 0 0 4.952-4.952 4.954 4.954 0 0 0-4.952-4.952Zm-19.496 100.226h-.1a1.682 1.682 0 0 1-1.58-1.782c1.389-23.293 20.783-41.544 44.155-41.544 19.473 0 36.447 12.481 42.24 31.057a1.677 1.677 0 0 1-1.109 2.107 1.677 1.677 0 0 1-2.107-1.109c-5.344-17.165-21.03-28.694-39.024-28.694-21.59 0-39.506 16.862-40.794 38.385a1.682 1.682 0 0 1-1.681 1.58Zm-12.089-111.67a1.4 1.4 0 0 1-.37-.045l-11.551-2.565a1.66 1.66 0 0 1-1.221-1.098 1.655 1.655 0 0 1 .302-1.614l8.134-9.803-13.019-2.095a1.678 1.678 0 0 1-.918-2.846l10.531-10.532a1.671 1.671 0 0 1 2.376 0c.649.66.661 1.725 0 2.375l-8.202 8.202 12.672 2.039c.594.09 1.098.504 1.311 1.064.213.56.101 1.199-.28 1.67l-8.258 9.949 8.874 1.972a1.68 1.68 0 0 1 1.277 2.005 1.683 1.683 0 0 1-1.635 1.311l-.023.011Zm-68.042 68.289a1.663 1.663 0 0 1-1.524-.975c-1.311-2.868-1.994-5.355-2.241-7.484-4.157-.84-8.257-3.63-10.162-9.658-.784-2.498-1.087-4.952-.93-7.283a14.842 14.842 0 0 1-2.812-1.613c-2.812-2.028-4.448-4.717-4.863-8-1.109-8.75 7.025-18.666 7.373-19.092a1.685 1.685 0 0 1 2.364-.224c.717.594.818 1.647.224 2.364-.079.09-7.563 9.221-6.622 16.526.303 2.353 1.445 4.213 3.496 5.692.493.359.974.65 1.445.896a15.674 15.674 0 0 1 5.076-7.764c3.417-2.846 7.63-3.877 10.218-2.498 1.232.649 1.938 1.927 1.927 3.484-.034 3.44-3.294 7.776-7.417 9.86-2.308 1.165-4.728 1.591-7.104 1.277-.022 1.591.213 3.372.841 5.355 1.333 4.247 4.022 6.409 6.901 7.216.348-3.384 1.815-5.479 2.757-6.487 2.33-2.51 5.859-3.563 8.582-2.555 1.893.695 3.07 2.319 3.148 4.325.146 3.832-3.675 7.305-9.086 8.235a13.47 13.47 0 0 1-1.916.202c.291 1.792.919 3.742 1.86 5.815.392.84.022 1.837-.829 2.229a1.739 1.739 0 0 1-.695.157h-.011Zm5.322-17.983c-1.199 0-2.723.561-3.922 1.86-1.098 1.177-1.725 2.734-1.893 4.572a13.605 13.605 0 0 0 1.501-.157c3.552-.616 6.375-2.768 6.297-4.796-.011-.414-.135-.997-.953-1.299a2.92 2.92 0 0 0-1.03-.168v-.012Zm-16.403-9.837c2.039.258 3.787-.28 5.109-.941 3.428-1.737 5.557-5.187 5.58-6.902 0-.157-.012-.425-.135-.493-1.165-.616-3.977.023-6.498 2.118-1.166.975-3.137 3.003-4.045 6.218h-.011Zm105.431-42.398a1.69 1.69 0 0 1-1.188-.493 1.67 1.67 0 0 1 0-2.376l7.574-7.574a1.67 1.67 0 0 1 2.375 0c.65.661.661 1.726 0 2.376l-7.574 7.574a1.69 1.69 0 0 1-1.187.493Zm-2.017-12.601a1.69 1.69 0 0 1-1.188-.493 1.67 1.67 0 0 1 0-2.375l7.294-7.294a1.67 1.67 0 0 1 2.375 0c.65.661.662 1.725 0 2.375l-7.293 7.294a1.69 1.69 0 0 1-1.188.493Zm88.165 42.094c-1.423 0-2.879-.213-4.336-.65-2.42-.729-4.526-2.23-6.263-4.146a17.099 17.099 0 0 1-7.328 1.95c-9.052.257-13.075-7.115-13.96-11.07a1.68 1.68 0 0 1 1.277-2.005 1.68 1.68 0 0 1 2.006 1.266c.09.369 2.106 8.739 10.577 8.447a13.455 13.455 0 0 0 5.389-1.31c-1.67-2.667-2.745-5.726-3.137-8.549-.493-3.597.235-6.196 2.061-7.35 1.065-.661 2.902-1.087 5.658.717 3.843 2.532 5.434 6.196 4.336 10.073-.638 2.252-2.084 4.302-4.044 5.938 1.266 1.311 2.745 2.319 4.392 2.812 4.773 1.434 8.257-.37 10.33-2.14 3.316-2.812 4.65-6.689 4.47-8.067a1.678 1.678 0 0 1 1.446-1.882c.918-.135 1.759.526 1.882 1.445.358 2.711-1.692 7.72-5.625 11.058-2.677 2.275-5.826 3.451-9.131 3.451v.012Zm-11.686-20.627a.539.539 0 0 0-.235.045c-.381.235-.863 1.557-.516 4.044.325 2.342 1.233 4.93 2.622 7.171 1.446-1.255 2.454-2.734 2.868-4.179.684-2.432-.336-4.627-2.946-6.353-.885-.582-1.457-.74-1.77-.74l-.023.012Zm-221.762 28.11c2.608-2.839 3.38-6.372 1.726-7.892-1.655-1.519-5.109-.449-7.717 2.391-2.607 2.839-3.38 6.373-1.725 7.892 1.654 1.519 5.109.449 7.716-2.391Z",
|
|
54
|
+
fill: palette.lines
|
|
55
|
+
}),
|
|
56
|
+
/* @__PURE__ */ jsx("path", {
|
|
57
|
+
d: "M114.963 131.871c-1.187 0-2.263-.358-3.092-1.12-1.244-1.143-1.692-2.98-1.244-5.053.392-1.782 1.401-3.63 2.868-5.221 3.283-3.574 7.72-4.672 10.095-2.488 2.376 2.185 1.67 6.689-1.613 10.275-2.14 2.33-4.773 3.607-7.003 3.607h-.011Zm1.009-9.12c-1.042 1.143-1.793 2.476-2.051 3.664-.19.863-.101 1.546.235 1.86.706.638 3.194.056 5.345-2.286s2.521-4.874 1.826-5.523c-.706-.639-3.193-.056-5.344 2.285h-.011Z",
|
|
58
|
+
fill: palette.lines
|
|
59
|
+
}),
|
|
60
|
+
/* @__PURE__ */ jsx("path", {
|
|
61
|
+
d: "M130.705 146.358c-1.187 0-2.263-.358-3.092-1.12l-15.753-14.487a1.682 1.682 0 0 1 2.274-2.476l15.753 14.487c.695.638 3.194.056 5.345-2.286 2.151-2.341 2.521-4.874 1.826-5.523l-15.753-14.487a1.681 1.681 0 1 1 2.274-2.476l15.753 14.486c2.376 2.185 1.659 6.689-1.624 10.263-2.14 2.331-4.773 3.608-7.003 3.608v.011Zm133.318 13.154a17.92 17.92 0 0 1-3.149-.28c-6.308-1.12-10.677-5.188-9.949-9.255.381-2.106 2.005-3.787 4.594-4.739 2.274-.84 5.097-1.02 7.943-.504 6.308 1.12 10.678 5.187 9.95 9.254-.381 2.107-2.006 3.787-4.594 4.74-1.423.526-3.07.784-4.795.784Zm-3.698-11.697c-1.333 0-2.599.19-3.652.583-1.401.515-2.286 1.299-2.443 2.173-.336 1.86 2.689 4.549 7.227 5.356 2.241.403 4.504.269 6.196-.348 1.4-.515 2.285-1.299 2.442-2.173.336-1.86-2.689-4.549-7.226-5.356a14.23 14.23 0 0 0-2.555-.224l.011-.011Z",
|
|
62
|
+
fill: palette.lines
|
|
63
|
+
}),
|
|
64
|
+
/* @__PURE__ */ jsx("path", {
|
|
65
|
+
d: "M250.678 162.53c-.1 0-.201 0-.302-.022a1.677 1.677 0 0 1-1.356-1.95l1.905-10.599a1.684 1.684 0 0 1 1.949-1.356 1.677 1.677 0 0 1 1.356 1.95l-1.905 10.599a1.676 1.676 0 0 1-1.647 1.389v-.011Zm17.771 11.269c-.101 0-.202 0-.303-.022a1.677 1.677 0 0 1-1.356-1.95l3.306-18.431a1.684 1.684 0 0 1 1.949-1.355 1.676 1.676 0 0 1 1.356 1.949l-3.305 18.431a1.678 1.678 0 0 1-1.647 1.389v-.011Zm-27.327-32.967a1.67 1.67 0 0 1-1.546-1.031l-5.233-12.391a1.661 1.661 0 0 1 0-1.289c.168-.414.493-.739.908-.918l25.332-10.689a1.68 1.68 0 0 1 2.196.896l5.233 12.392c.179.414.179.874 0 1.288-.168.415-.493.74-.908.919l-25.332 10.689a1.7 1.7 0 0 1-.65.134Zm-3.025-13.176 3.921 9.288 22.24-9.377-3.921-9.289-22.24 9.378Zm-6.891 29.578c-.426 0-.841-.157-1.165-.47l-12.291-11.899-6.297 6.498a1.67 1.67 0 0 1-2.375.034 1.67 1.67 0 0 1-.034-2.375l7.462-7.709a1.68 1.68 0 0 1 2.375-.033l13.501 13.075a1.67 1.67 0 0 1 .034 2.375 1.7 1.7 0 0 1-1.21.516v-.012Zm-46.945 21.455c-.426 0-.841-.157-1.166-.47a1.672 1.672 0 0 1-.033-2.376l14.857-15.338a1.67 1.67 0 0 1 2.375-.034c.672.65.683 1.715.033 2.376l-14.856 15.338a1.699 1.699 0 0 1-1.21.515v-.011Zm147.67-14.599c-.291 0-.582-.078-.84-.224l-20.672-11.932a1.683 1.683 0 0 1-.616-2.297l11.932-20.672a1.706 1.706 0 0 1 1.02-.784 1.701 1.701 0 0 1 1.277.168l20.672 11.932a1.683 1.683 0 0 1 .616 2.297l-11.932 20.672a1.703 1.703 0 0 1-1.02.784 1.925 1.925 0 0 1-.437.056Zm-18.375-14.229 17.759 10.252 10.252-17.759-17.759-10.252-10.252 17.759Zm-152.465 15.736h-.056l-15.653-.47a1.708 1.708 0 0 1-1.434-.886 1.696 1.696 0 0 1 .045-1.68l8.235-13.322c.314-.515.885-.851 1.479-.795a1.703 1.703 0 0 1 1.434.885l7.417 13.792a1.7 1.7 0 0 1-.044 1.681 1.689 1.689 0 0 1-1.435.795h.012Zm-12.695-3.742 9.838.291-4.661-8.661-5.177 8.37Zm142.08-6.875a1.69 1.69 0 0 1-1.457-.84l-11.114-19.26a1.666 1.666 0 0 1 0-1.68 1.687 1.687 0 0 1 1.456-.841h22.24a1.69 1.69 0 0 1 1.457.841 1.67 1.67 0 0 1 0 1.68l-11.115 19.26c-.302.516-.851.84-1.456.84h-.011Zm-8.213-19.259 8.213 14.218 8.212-14.218h-16.425Z",
|
|
66
|
+
fill: palette.lines
|
|
67
|
+
}),
|
|
68
|
+
/* @__PURE__ */ jsx("path", {
|
|
69
|
+
d: "m198.109 134.477 18.476 24.761-30.689 3.619 12.213-28.38Z",
|
|
70
|
+
fill: palette.lines
|
|
71
|
+
}),
|
|
72
|
+
/* @__PURE__ */ jsx("path", {
|
|
73
|
+
d: "M185.897 164.536a1.671 1.671 0 0 1-1.345-.672 1.69 1.69 0 0 1-.202-1.669l12.202-28.391c.235-.549.75-.93 1.344-1.009a1.654 1.654 0 0 1 1.546.661l18.487 24.761a1.69 1.69 0 0 1 .202 1.67c-.235.549-.751.93-1.345 1.008l-30.688 3.63c-.067 0-.134.011-.201.011Zm12.593-26.733-9.904 23.036 24.906-2.947-15.002-20.1v.011Zm117.554 116.906c-4.941 0-10.655-1.065-17.165-3.855a1.69 1.69 0 0 1-.885-2.207 1.688 1.688 0 0 1 2.207-.885c24.447 10.498 36.077-5.019 36.559-5.692a1.685 1.685 0 0 1 2.342-.381c.75.538.918 1.591.381 2.342-.101.146-7.899 10.678-23.451 10.678h.012Z",
|
|
74
|
+
fill: palette.lines
|
|
75
|
+
}),
|
|
76
|
+
/* @__PURE__ */ jsx("path", {
|
|
77
|
+
d: "M198.277 198.441c0 .896-.056 1.77-.145 2.633-20.089-1.972-35.854-5.143-47.047-8.022 2.443-10.611 11.944-18.521 23.283-18.521 13.198 0 23.909 10.7 23.909 23.91Z",
|
|
78
|
+
fill: palette.shapes2
|
|
79
|
+
}),
|
|
80
|
+
/* @__PURE__ */ jsx("path", {
|
|
81
|
+
d: "M253.961 168.822a15.8 15.8 0 0 1-2.073 7.865l-14.43-8.335-8.101 14.027c-4.482-2.846-7.462-7.854-7.462-13.557 0-8.862 7.171-16.033 16.033-16.033 8.863 0 16.033 7.171 16.033 16.033Z",
|
|
82
|
+
fill: palette.shapes1
|
|
83
|
+
}),
|
|
84
|
+
/* @__PURE__ */ jsx("path", {
|
|
85
|
+
d: "M154.043 449.909a1.76 1.76 0 0 1-.784-.19 1.68 1.68 0 0 1-.695-2.275c2.824-5.344 5.468-10.162 8.034-14.834 21.164-38.576 29.926-54.541 3.428-121.71-15.551-39.416-21.243-70.149-23.282-88.994-1.972-18.162-1.053-28.885-.773-31.417a2.363 2.363 0 0 1 0-.571c.123-.852.963-1.457 1.792-1.446.359.012.695.146.975.359.706.246 3.025.964 10.577 2.902 13.602 3.496 28.738 6.072 44.984 7.663 17.681 1.726 36.347 2.23 55.483 1.468 23.025-.885 47.147-3.596 71.695-8.056a464.258 464.258 0 0 0 11.384-2.196 553.362 553.362 0 0 0 15.394-3.327 565.684 565.684 0 0 0 7.249-1.714c.46-.112.941-.023 1.334.246.392.269.649.684.717 1.154.045.336 1.098 8.302-3.608 29.187l42.912 86.148c.224.46.235.986.022 1.457a1.697 1.697 0 0 1-1.12.93l-30.812 7.663c-.056 37.702-2.677 71.404-30.733 73.107-9.893.605-33.052 2.006-55.437-4.033-27.473-7.406-44.772-23.428-51.427-47.618a1.674 1.674 0 0 1 1.176-2.061 1.675 1.675 0 0 1 2.062 1.176c6.319 22.957 22.822 38.184 49.062 45.265 21.86 5.893 44.638 4.515 54.363 3.921 25.467-1.546 27.584-34.497 27.584-71.056a1.69 1.69 0 0 1 1.278-1.636l30.049-7.473-42.251-84.815a1.682 1.682 0 0 1-.134-1.121c3.417-15.002 3.809-23.282 3.776-26.688-1.782.426-3.552.84-5.311 1.244a595.78 595.78 0 0 1-15.473 3.35c-3.72.762-7.574 1.501-11.451 2.207-24.705 4.493-48.984 7.227-72.165 8.112-19.283.75-38.106.257-55.942-1.491-16.415-1.602-31.719-4.212-45.5-7.753-4.269-1.098-7.395-1.938-9.311-2.498-.706 9.624-1.838 51.718 23.977 117.172 27.069 68.637 17.456 86.16-3.619 124.557-2.555 4.661-5.199 9.467-8.011 14.789a1.683 1.683 0 0 1-1.49.896h.022Z",
|
|
86
|
+
fill: palette.lines
|
|
87
|
+
}),
|
|
88
|
+
/* @__PURE__ */ jsx("path", {
|
|
89
|
+
d: "M217.985 203.765a1.683 1.683 0 0 1-1.456-2.521l19.517-33.826a1.71 1.71 0 0 1 1.02-.784 1.701 1.701 0 0 1 1.277.168l22.756 13.143a1.681 1.681 0 0 1 .616 2.296 1.673 1.673 0 0 1-2.297.617l-21.299-12.302-18.677 32.368a1.683 1.683 0 0 1-1.457.841Z",
|
|
90
|
+
fill: palette.lines
|
|
91
|
+
})
|
|
92
|
+
]
|
|
93
|
+
});
|
|
94
|
+
};
|
|
95
|
+
var ThinkingMedium_default = ThinkingMedium;
|
|
96
|
+
export { ThinkingMedium_default as t };
|
|
97
|
+
|
|
98
|
+
//# sourceMappingURL=ThinkingMedium.js.map
|