@laerdal/life-react-components 1.10.3-dev.39 → 1.10.3-dev.41
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.
|
@@ -37,11 +37,11 @@ var StyledLink = (0, _styledComponents.default)(_reactRouterDom.Link)(_templateO
|
|
|
37
37
|
return props.$color;
|
|
38
38
|
}, _styles.BREAKPOINTS.MEDIUM);
|
|
39
39
|
|
|
40
|
-
var LogoContainer = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n align-items: center;\n height: 40px;\n margin-right: 16px;\n box-sizing: border-box;\n padding: 24px 0;\n\n ", " {\n margin-top: 8px;\n margin-bottom: 7px;\n }\n\n &:focus-within {\n ", "\n }\n\n &.inverted:focus-within {\n ", "\n }\n"])), _styles.BREAKPOINTS.LARGE, _styles.focusStyles, _styles.invertedFocusStyles);
|
|
40
|
+
var LogoContainer = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n max-width: calc(100% - 48px);\n overflow: hidden;\n align-items: center;\n height: 40px;\n margin-right: 16px;\n box-sizing: border-box;\n padding: 24px 0;\n\n ", " {\n margin-top: 8px;\n margin-bottom: 7px;\n }\n\n &:focus-within {\n ", "\n }\n\n &.inverted:focus-within {\n ", "\n }\n"])), _styles.BREAKPOINTS.LARGE, _styles.focusStyles, _styles.invertedFocusStyles);
|
|
41
41
|
|
|
42
|
-
var Name = _styledComponents.default.span(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n margin-left: 8px;\n padding-left: 8px;\n border-left: 1px solid ", ";\n letter-spacing: -0.02em;\n max-width: 200px;\n white-space: nowrap;\n overflow: hidden;\n\n ", "\n\n font-weight: 300 !important;\n line-height: 24px !important;\n\n ", " {\n ", ";\n }\n\n ", " {\n margin-left: 12px;\n padding-left: 12px;\n }\n"])), function (props) {
|
|
42
|
+
var Name = _styledComponents.default.span(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n margin-left: 8px;\n padding-left: 8px;\n border-left: 1px solid ", ";\n letter-spacing: -0.02em;\n max-width: 168px;\n ", " {\n max-width: 200px;\n }\n \n white-space: nowrap;\n overflow: hidden;\n\n ", "\n\n font-weight: 300 !important;\n line-height: 24px !important;\n\n ", " {\n ", ";\n }\n\n ", " {\n margin-left: 12px;\n padding-left: 12px;\n }\n"])), function (props) {
|
|
43
43
|
return props.$color || _styles.COLORS.black;
|
|
44
|
-
}, function (props) {
|
|
44
|
+
}, _styles.BREAKPOINTS.SMALL, function (props) {
|
|
45
45
|
return props.noSizeChangeOnMobile ? (0, _styles.ComponentMStyling)(_styles.ComponentTextStyle.Regular, props.$color || _styles.COLORS.black) : (0, _styles.ComponentXSStyling)(_styles.ComponentTextStyle.Regular, props.$color || _styles.COLORS.black);
|
|
46
46
|
}, _styles.BREAKPOINTS.MEDIUM, function (props) {
|
|
47
47
|
return (0, _styles.ComponentMStyling)(_styles.ComponentTextStyle.Regular, props.$color || _styles.COLORS.black);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/GlobalNavigationBar/Logo.tsx"],"names":["StyledLink","Link","props","$color","BREAKPOINTS","MEDIUM","LogoContainer","styled","div","LARGE","focusStyles","invertedFocusStyles","Name","span","COLORS","black","noSizeChangeOnMobile","ComponentTextStyle","Regular","BetaTag","backgroundColor","accent2_500","UppercaseBold","white","Logo","name","showBetaTag","onClick","to","color","betaTagBackgroundColor","betaTagColor","inverted","defaultOnMouseDownHandler"],"mappings":";;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AAEA;;;;;;;;;;AAEA,IAAMA,UAAU,GAAG,+BAAOC,oBAAP,CAAH,+VAWH,UAACC,KAAD;AAAA,SAAWA,KAAK,CAACC,MAAjB;AAAA,CAXG,EAYVC,oBAAYC,MAZF,CAAhB;;AAmBA,IAAMC,aAAa,GAAGC,0BAAOC,GAAV,
|
|
1
|
+
{"version":3,"sources":["../../src/GlobalNavigationBar/Logo.tsx"],"names":["StyledLink","Link","props","$color","BREAKPOINTS","MEDIUM","LogoContainer","styled","div","LARGE","focusStyles","invertedFocusStyles","Name","span","COLORS","black","SMALL","noSizeChangeOnMobile","ComponentTextStyle","Regular","BetaTag","backgroundColor","accent2_500","UppercaseBold","white","Logo","name","showBetaTag","onClick","to","color","betaTagBackgroundColor","betaTagColor","inverted","defaultOnMouseDownHandler"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { Link } from 'react-router-dom';\nimport styled from 'styled-components';\nimport { LaerdalLogo, LaerdalWhiteLogo } from '../assets';\nimport {BREAKPOINTS, COLORS, ComponentTextStyle, focusStyles, invertedFocusStyles} from '../styles';\nimport { ComponentMStyling, ComponentXSStyling } from '../styles';\nimport {defaultOnMouseDownHandler} from '../common';\n\nconst StyledLink = styled(Link)<{ $color?: string }>`\n text-align: center;\n text-decoration: none;\n display: flex;\n align-items: center;\n &:focus-within {\n outline: none;\n }\n svg {\n width: 66px;\n height: 36px;\n color: ${(props) => props.$color};\n ${BREAKPOINTS.MEDIUM} {\n width: 88px;\n height: 48px;\n }\n }\n`;\n\nconst LogoContainer = styled.div`\n display: flex;\n max-width: calc(100% - 48px);\n overflow: hidden;\n align-items: center;\n height: 40px;\n margin-right: 16px;\n box-sizing: border-box;\n padding: 24px 0;\n\n ${BREAKPOINTS.LARGE} {\n margin-top: 8px;\n margin-bottom: 7px;\n }\n\n &:focus-within {\n ${focusStyles}\n }\n\n &.inverted:focus-within {\n ${invertedFocusStyles}\n }\n`;\n\nconst Name = styled.span<{ $color?: string; noSizeChangeOnMobile: boolean }>`\n margin-left: 8px;\n padding-left: 8px;\n border-left: 1px solid ${(props) => props.$color || COLORS.black};\n letter-spacing: -0.02em;\n max-width: 168px;\n ${BREAKPOINTS.SMALL} {\n max-width: 200px;\n }\n \n white-space: nowrap;\n overflow: hidden;\n\n ${(props) =>\n props.noSizeChangeOnMobile\n ? ComponentMStyling(ComponentTextStyle.Regular, props.$color || COLORS.black)\n : ComponentXSStyling(ComponentTextStyle.Regular, props.$color || COLORS.black)}\n\n font-weight: 300 !important;\n line-height: 24px !important;\n\n ${BREAKPOINTS.MEDIUM} {\n ${(props) => ComponentMStyling(ComponentTextStyle.Regular, props.$color || COLORS.black)};\n }\n\n ${BREAKPOINTS.LARGE} {\n margin-left: 12px;\n padding-left: 12px;\n }\n`;\n\nconst BetaTag = styled.span<{ backgroundColor?: string; $color?: string }>`\n background-color: ${(props) => props.backgroundColor || COLORS.accent2_500};\n padding: 4px 8px;\n margin-left: 8px;\n margin-top: 2px;\n border-left: none;\n border-radius: 2px;\n\n ${(props) => ComponentXSStyling(ComponentTextStyle.UppercaseBold, props.$color || COLORS.white)}\n`;\n\ntype LogoProps = {\n name: string;\n showBetaTag?: boolean;\n onClick?: () => void;\n to?: string;\n color?: string;\n noSizeChangeOnMobile?: boolean;\n betaTagBackgroundColor?: string;\n betaTagColor?: string;\n inverted?: boolean;\n};\n\nconst Logo = ({ name, showBetaTag, onClick, to, color, noSizeChangeOnMobile, betaTagBackgroundColor, betaTagColor, inverted }: LogoProps): React.ReactElement<LogoProps> => {\n return (\n <LogoContainer className={inverted ? 'inverted' : ''}>\n <StyledLink\n to={to || '/'}\n onMouseDown={defaultOnMouseDownHandler}\n onClick={() => {\n if (onClick) {\n onClick();\n }\n }}\n $color={color}>\n {color === COLORS.white ? <LaerdalWhiteLogo /> : <LaerdalLogo />}\n <Name $color={color} noSizeChangeOnMobile={noSizeChangeOnMobile || false}>\n {name}\n </Name>\n {showBetaTag && (\n <BetaTag backgroundColor={betaTagBackgroundColor} $color={betaTagColor}>\n BETA\n </BetaTag>\n )}\n </StyledLink>\n </LogoContainer>\n );\n};\n\nexport default Logo;\n"],"file":"Logo.cjs"}
|
|
@@ -15,10 +15,10 @@ import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
15
15
|
var StyledLink = styled(Link)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n text-align: center;\n text-decoration: none;\n display: flex;\n align-items: center;\n &:focus-within {\n outline: none;\n }\n svg {\n width: 66px;\n height: 36px;\n color: ", ";\n ", " {\n width: 88px;\n height: 48px;\n }\n }\n"])), function (props) {
|
|
16
16
|
return props.$color;
|
|
17
17
|
}, BREAKPOINTS.MEDIUM);
|
|
18
|
-
var LogoContainer = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n height: 40px;\n margin-right: 16px;\n box-sizing: border-box;\n padding: 24px 0;\n\n ", " {\n margin-top: 8px;\n margin-bottom: 7px;\n }\n\n &:focus-within {\n ", "\n }\n\n &.inverted:focus-within {\n ", "\n }\n"])), BREAKPOINTS.LARGE, focusStyles, invertedFocusStyles);
|
|
19
|
-
var Name = styled.span(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n margin-left: 8px;\n padding-left: 8px;\n border-left: 1px solid ", ";\n letter-spacing: -0.02em;\n max-width: 200px;\n white-space: nowrap;\n overflow: hidden;\n\n ", "\n\n font-weight: 300 !important;\n line-height: 24px !important;\n\n ", " {\n ", ";\n }\n\n ", " {\n margin-left: 12px;\n padding-left: 12px;\n }\n"])), function (props) {
|
|
18
|
+
var LogoContainer = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n display: flex;\n max-width: calc(100% - 48px);\n overflow: hidden;\n align-items: center;\n height: 40px;\n margin-right: 16px;\n box-sizing: border-box;\n padding: 24px 0;\n\n ", " {\n margin-top: 8px;\n margin-bottom: 7px;\n }\n\n &:focus-within {\n ", "\n }\n\n &.inverted:focus-within {\n ", "\n }\n"])), BREAKPOINTS.LARGE, focusStyles, invertedFocusStyles);
|
|
19
|
+
var Name = styled.span(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n margin-left: 8px;\n padding-left: 8px;\n border-left: 1px solid ", ";\n letter-spacing: -0.02em;\n max-width: 168px;\n ", " {\n max-width: 200px;\n }\n \n white-space: nowrap;\n overflow: hidden;\n\n ", "\n\n font-weight: 300 !important;\n line-height: 24px !important;\n\n ", " {\n ", ";\n }\n\n ", " {\n margin-left: 12px;\n padding-left: 12px;\n }\n"])), function (props) {
|
|
20
20
|
return props.$color || COLORS.black;
|
|
21
|
-
}, function (props) {
|
|
21
|
+
}, BREAKPOINTS.SMALL, function (props) {
|
|
22
22
|
return props.noSizeChangeOnMobile ? ComponentMStyling(ComponentTextStyle.Regular, props.$color || COLORS.black) : ComponentXSStyling(ComponentTextStyle.Regular, props.$color || COLORS.black);
|
|
23
23
|
}, BREAKPOINTS.MEDIUM, function (props) {
|
|
24
24
|
return ComponentMStyling(ComponentTextStyle.Regular, props.$color || COLORS.black);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/GlobalNavigationBar/Logo.tsx"],"names":["React","Link","styled","LaerdalLogo","LaerdalWhiteLogo","BREAKPOINTS","COLORS","ComponentTextStyle","focusStyles","invertedFocusStyles","ComponentMStyling","ComponentXSStyling","defaultOnMouseDownHandler","StyledLink","props","$color","MEDIUM","LogoContainer","div","LARGE","Name","span","black","noSizeChangeOnMobile","Regular","BetaTag","backgroundColor","accent2_500","UppercaseBold","white","Logo","name","showBetaTag","onClick","to","color","betaTagBackgroundColor","betaTagColor","inverted"],"mappings":";;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,IAAT,QAAqB,kBAArB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,SAASC,WAAT,EAAsBC,gBAAtB,QAA8C,WAA9C;AACA,SAAQC,WAAR,EAAqBC,MAArB,EAA6BC,kBAA7B,EAAiDC,WAAjD,EAA8DC,mBAA9D,QAAwF,WAAxF;AACA,SAASC,iBAAT,EAA4BC,kBAA5B,QAAsD,WAAtD;AACA,SAAQC,yBAAR,QAAwC,WAAxC;;;AAEA,IAAMC,UAAU,GAAGX,MAAM,CAACD,IAAD,CAAT,iVAWH,UAACa,KAAD;AAAA,SAAWA,KAAK,CAACC,MAAjB;AAAA,CAXG,EAYVV,WAAW,CAACW,MAZF,CAAhB;AAmBA,IAAMC,aAAa,GAAGf,MAAM,CAACgB,GAAV,
|
|
1
|
+
{"version":3,"sources":["../../src/GlobalNavigationBar/Logo.tsx"],"names":["React","Link","styled","LaerdalLogo","LaerdalWhiteLogo","BREAKPOINTS","COLORS","ComponentTextStyle","focusStyles","invertedFocusStyles","ComponentMStyling","ComponentXSStyling","defaultOnMouseDownHandler","StyledLink","props","$color","MEDIUM","LogoContainer","div","LARGE","Name","span","black","SMALL","noSizeChangeOnMobile","Regular","BetaTag","backgroundColor","accent2_500","UppercaseBold","white","Logo","name","showBetaTag","onClick","to","color","betaTagBackgroundColor","betaTagColor","inverted"],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { Link } from 'react-router-dom';\nimport styled from 'styled-components';\nimport { LaerdalLogo, LaerdalWhiteLogo } from '../assets';\nimport {BREAKPOINTS, COLORS, ComponentTextStyle, focusStyles, invertedFocusStyles} from '../styles';\nimport { ComponentMStyling, ComponentXSStyling } from '../styles';\nimport {defaultOnMouseDownHandler} from '../common';\n\nconst StyledLink = styled(Link)<{ $color?: string }>`\n text-align: center;\n text-decoration: none;\n display: flex;\n align-items: center;\n &:focus-within {\n outline: none;\n }\n svg {\n width: 66px;\n height: 36px;\n color: ${(props) => props.$color};\n ${BREAKPOINTS.MEDIUM} {\n width: 88px;\n height: 48px;\n }\n }\n`;\n\nconst LogoContainer = styled.div`\n display: flex;\n max-width: calc(100% - 48px);\n overflow: hidden;\n align-items: center;\n height: 40px;\n margin-right: 16px;\n box-sizing: border-box;\n padding: 24px 0;\n\n ${BREAKPOINTS.LARGE} {\n margin-top: 8px;\n margin-bottom: 7px;\n }\n\n &:focus-within {\n ${focusStyles}\n }\n\n &.inverted:focus-within {\n ${invertedFocusStyles}\n }\n`;\n\nconst Name = styled.span<{ $color?: string; noSizeChangeOnMobile: boolean }>`\n margin-left: 8px;\n padding-left: 8px;\n border-left: 1px solid ${(props) => props.$color || COLORS.black};\n letter-spacing: -0.02em;\n max-width: 168px;\n ${BREAKPOINTS.SMALL} {\n max-width: 200px;\n }\n \n white-space: nowrap;\n overflow: hidden;\n\n ${(props) =>\n props.noSizeChangeOnMobile\n ? ComponentMStyling(ComponentTextStyle.Regular, props.$color || COLORS.black)\n : ComponentXSStyling(ComponentTextStyle.Regular, props.$color || COLORS.black)}\n\n font-weight: 300 !important;\n line-height: 24px !important;\n\n ${BREAKPOINTS.MEDIUM} {\n ${(props) => ComponentMStyling(ComponentTextStyle.Regular, props.$color || COLORS.black)};\n }\n\n ${BREAKPOINTS.LARGE} {\n margin-left: 12px;\n padding-left: 12px;\n }\n`;\n\nconst BetaTag = styled.span<{ backgroundColor?: string; $color?: string }>`\n background-color: ${(props) => props.backgroundColor || COLORS.accent2_500};\n padding: 4px 8px;\n margin-left: 8px;\n margin-top: 2px;\n border-left: none;\n border-radius: 2px;\n\n ${(props) => ComponentXSStyling(ComponentTextStyle.UppercaseBold, props.$color || COLORS.white)}\n`;\n\ntype LogoProps = {\n name: string;\n showBetaTag?: boolean;\n onClick?: () => void;\n to?: string;\n color?: string;\n noSizeChangeOnMobile?: boolean;\n betaTagBackgroundColor?: string;\n betaTagColor?: string;\n inverted?: boolean;\n};\n\nconst Logo = ({ name, showBetaTag, onClick, to, color, noSizeChangeOnMobile, betaTagBackgroundColor, betaTagColor, inverted }: LogoProps): React.ReactElement<LogoProps> => {\n return (\n <LogoContainer className={inverted ? 'inverted' : ''}>\n <StyledLink\n to={to || '/'}\n onMouseDown={defaultOnMouseDownHandler}\n onClick={() => {\n if (onClick) {\n onClick();\n }\n }}\n $color={color}>\n {color === COLORS.white ? <LaerdalWhiteLogo /> : <LaerdalLogo />}\n <Name $color={color} noSizeChangeOnMobile={noSizeChangeOnMobile || false}>\n {name}\n </Name>\n {showBetaTag && (\n <BetaTag backgroundColor={betaTagBackgroundColor} $color={betaTagColor}>\n BETA\n </BetaTag>\n )}\n </StyledLink>\n </LogoContainer>\n );\n};\n\nexport default Logo;\n"],"file":"Logo.js"}
|