@foxford/ui 2.5.0-beta-4ad980e-20230626 → 2.5.0-beta-a6ad80d-20230627

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.
@@ -1,2 +1,2 @@
1
- import o from'@babel/runtime/helpers/taggedTemplateLiteral';import t,{css as e}from'styled-components';import{screenS as i,screenXs as r}from'../../mixins/screen.js';var n,p;var c=t.div.withConfig({shouldForwardProp:o=>['children','className','style'].includes(o)}).withConfig({componentId:"fox-ui__sc-1v79u95-0"})(["display:flex;align-items:",";justify-content:",";padding:",";padding-left:",";padding-right:",";height:",";max-width:100%;width:",";border-radius:",";background-color:",";box-shadow:",";box-sizing:border-box;"," "," .iconWrapper{display:flex;margin-right:",";","}.title{display:inline-block;margin-top:",";margin-bottom:8px;max-width:100%;vertical-align:middle;white-space:nowrap;text-overflow:ellipsis;font-weight:700;overflow:hidden;}.content{display:flex;margin-right:auto;flex-direction:",";align-items:",";max-width:",";white-space:",";overflow:",";}.text{line-height:",";color:",";text-overflow:",";white-space:",";overflow:hidden;}.link{display:flex;margin-top:",";margin-left:",";color:",";}.actions{margin-top:",";margin-left:",";}.primaryAction{margin-left:0;}.secondaryAction{margin-right:",";}.timer{line-height:",";font-weight:",";font-size:",";color:",";svg{transform:rotateY(180deg);}}.cancelTimer{margin-left:",";}.closeIconWrapper{display:flex;margin-left:",";cursor:pointer;}"],(o=>o.column||o.isCompact&&!o.withTimer?'flex-start':'center'),(o=>o.withTimer?'space-between':'flex-start'),(o=>o.isCompact?o.column?'16px':o.withTimer?'5px 12px 5px 16px':'12px 12px 12px 16px':o.column?'16px':o.withImage?'8px 16px':o.withTimer?'2px 16px 2px 20px':'12px 16px 12px 20px'),(o=>o.isCompact?o.withTitle?o.withImage||!o.noIcon?'16px':'20px':o.withImage?'12px':o.withAction&&o.noIcon?'20px':'16px':o.withTitle?o.withImage||!o.noIcon?'16px':'24px':o.withImage?'16px':'20px'),(o=>o.withCloseIcon?o.isCompact?'12px':'16px':o.withTimer?'8px':'20px'),(o=>o.isCompact||o.column?'auto':'48px'),(o=>"".concat(o.isCompact?'351px':'fit-content')),(o=>o.column?o.isCompact?'20px':'12px':'30px'),(o=>o.clear?o.theme.colors['bg-oncolor-primary']:((o,t)=>{switch(o){case'error':return t.colors['alert-bg-error-200'];case'info':return t.colors['bg-brand-primary-200'];case'success':return t.colors['alert-bg-success-200'];case'warning':return t.colors['alert-bg-warning-200'];default:return t.colors['bg-oncolor-primary']}})(o.type,o.theme)),(o=>o.clear?'0 6px 20px 0 rgba(0, 0, 0, 0.1)':'none'),i()(n||(n=o(["\n width: 351px;\n "]))),r()(p||(p=o(["\n width: 304px;\n "]))),(o=>o.isCompact?'8px':o.column?o.withImage?'8px':'12px':'8px'),(o=>o.withImage&&e(["img,svg{height:",";width:",";}"],(o=>o.isCompact?'20px':o.column?'28px':'32px'),(o=>o.isCompact?'20px':o.column?'28px':'32px'))),(o=>o.isCompact?'0':'2px'),(o=>o.column?'column':'row'),(o=>o.column?'flex-start':'center'),(o=>o.column?'260px':'initial'),(o=>o.column||o.isCompact?'normal':'nowrap'),(o=>o.column||o.isCompact?'auto':'hidden'),(o=>o.isCompact?'18px':'20px'),(o=>o.theme.colors['content-oncolor-constant']),(o=>o.column||o.isCompact?'clip':'ellipsis'),(o=>o.column||o.isCompact?'pre-wrap':'normal'),(o=>o.column?o.isCompact&&!o.withTitle?'4px':'12px':0),(o=>o.column?0:'60px'),(o=>o.clear?o.theme.colors['content-link']:o.theme.colors['content-oncolor-constant']),(o=>o.column?o.isCompact?o.withTitle?'16px':'8px':'16px':0),(o=>o.column?0:'60px'),(o=>o.column?'4px':'8px'),(o=>o.isCompact?'12px':'18px'),(o=>o.isCompact?'700':'400'),(o=>o.isCompact?'11px':'14px'),(o=>((o,t)=>{switch(o){case'error':return t.colors['alert-bg-error-500'];case'info':default:return t.colors['content-brand-primary'];case'success':return t.colors['alert-success'];case'warning':return t.colors['alert-warning']}})(o.type,o.theme)),(o=>o.isCompact?'28px':'60px'),(o=>o.withTimer?'0':'16px'));export{c as Root};
1
+ import o from'@babel/runtime/helpers/taggedTemplateLiteral';import t,{css as e}from'styled-components';import{screenS as i,screenXs as r}from'../../mixins/screen.js';var n,p;var c=t.div.withConfig({shouldForwardProp:o=>['children','className','style'].includes(o)}).withConfig({componentId:"fox-ui__sc-1v79u95-0"})(["display:flex;align-items:",";justify-content:",";padding:",";padding-left:",";padding-right:",";height:",";max-width:100%;width:",";border-radius:",";background-color:",";box-shadow:",";box-sizing:border-box;"," "," .iconWrapper{display:flex;margin-right:",";","}.title{display:inline-block;margin-top:",";margin-bottom:8px;max-width:100%;vertical-align:middle;white-space:nowrap;text-overflow:ellipsis;font-weight:700;overflow:hidden;}.content{display:flex;margin-right:auto;flex-direction:",";align-items:",";max-width:",";white-space:",";overflow:",";}.text{line-height:",";color:",";text-overflow:",";white-space:",";overflow:hidden;}.link{display:flex;margin-top:",";margin-left:",";color:",";}.actions{margin-top:",";margin-left:",";}.primaryAction{margin-left:0;}.secondaryAction{margin-right:",";}.timer{line-height:",";font-weight:",";font-size:",";color:",";svg{transform:rotateY(180deg);}}.cancelTimer{margin-left:",";}.closeIconWrapper{display:flex;margin-left:",";cursor:pointer;}"],(o=>o.column||o.isCompact&&!o.withTimer?'flex-start':'center'),(o=>o.withTimer?'space-between':'flex-start'),(o=>o.isCompact?o.column?'16px':o.withTimer?'5px 12px 5px 16px':'12px 12px 12px 16px':o.column?'16px':o.withImage?'8px 16px':o.withTimer?'2px 16px 2px 20px':'12px 16px 12px 20px'),(o=>o.isCompact?o.withTitle?o.withImage||!o.noIcon?'16px':'20px':o.withImage?'12px':o.withAction&&o.noIcon?'20px':'16px':o.withTitle?o.withImage||!o.noIcon?'16px':'24px':o.withImage?'16px':'20px'),(o=>o.withCloseIcon?o.isCompact?'12px':'16px':o.withTimer?'8px':'20px'),(o=>o.isCompact||o.column?'auto':'48px'),(o=>"".concat(o.isCompact?'351px':'fit-content')),(o=>o.column?o.isCompact?'20px':'12px':'30px'),(o=>o.clear?o.theme.colors['bg-oncolor-primary']:((o,t)=>{switch(o){case'error':return t.colors['alert-bg-error-200'];case'info':return t.colors['bg-brand-primary-200'];case'success':return t.colors['alert-bg-success-200'];case'warning':return t.colors['alert-bg-warning-200'];default:return t.colors['bg-oncolor-primary']}})(o.type,o.theme)),(o=>o.clear?'0 6px 20px 0 rgba(0, 0, 0, 0.1)':'none'),i()(n||(n=o(["\n width: 351px;\n "]))),r()(p||(p=o(["\n width: 304px;\n "]))),(o=>o.isCompact?'8px':o.column?o.withImage?'8px':'12px':'8px'),(o=>o.withImage&&e(["img,svg{height:",";width:",";}"],(o=>o.isCompact?'20px':o.column?'28px':'32px'),(o=>o.isCompact?'20px':o.column?'28px':'32px'))),(o=>o.isCompact?'0':'2px'),(o=>o.column?'column':'row'),(o=>o.column?'flex-start':'center'),(o=>o.column?'260px':'initial'),(o=>o.column||o.isCompact?'normal':'nowrap'),(o=>o.column||o.isCompact?'auto':'hidden'),(o=>o.isCompact?'18px':'20px'),(o=>o.theme.colors['content-oncolor-constant']),(o=>o.column||o.isCompact?'clip':'ellipsis'),(o=>o.column||o.isCompact?'pre-wrap':'inherit'),(o=>o.column?o.isCompact&&!o.withTitle?'4px':'12px':0),(o=>o.column?0:'60px'),(o=>o.clear?o.theme.colors['content-link']:o.theme.colors['content-oncolor-constant']),(o=>o.column?o.isCompact?o.withTitle?'16px':'8px':'16px':0),(o=>o.column?0:'60px'),(o=>o.column?'4px':'8px'),(o=>o.isCompact?'12px':'18px'),(o=>o.isCompact?'700':'400'),(o=>o.isCompact?'11px':'14px'),(o=>((o,t)=>{switch(o){case'error':return t.colors['alert-bg-error-500'];case'info':default:return t.colors['content-brand-primary'];case'success':return t.colors['alert-success'];case'warning':return t.colors['alert-warning']}})(o.type,o.theme)),(o=>o.isCompact?'28px':'60px'),(o=>o.withTimer?'0':'16px'));export{c as Root};
2
2
  //# sourceMappingURL=style.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","sources":["../../../../src/components/Alert/style.ts"],"sourcesContent":["import styled, { css, DefaultTheme } from 'styled-components'\n\nimport { screenS, screenXs } from '../../mixins/screen'\n\nimport { AlertProps, AlertType } from './Alert'\n\nconst color = (type: AlertType, theme: DefaultTheme) => {\n switch (type) {\n case 'error':\n return theme.colors['alert-bg-error-200']\n case 'info':\n return theme.colors['bg-brand-primary-200']\n case 'success':\n return theme.colors['alert-bg-success-200']\n case 'warning':\n return theme.colors['alert-bg-warning-200']\n default:\n return theme.colors['bg-oncolor-primary']\n }\n}\n\nconst countdownColor = (type: AlertType, theme: DefaultTheme) => {\n switch (type) {\n case 'error':\n return theme.colors['alert-bg-error-500']\n case 'info':\n return theme.colors['content-brand-primary']\n case 'success':\n return theme.colors['alert-success']\n case 'warning':\n return theme.colors['alert-warning']\n default:\n return theme.colors['content-brand-primary']\n }\n}\n\ntype AdditionalAlertTypes = {\n column: boolean\n isCompact: boolean\n withAction: boolean\n withCloseIcon: boolean\n withImage: boolean\n withLink: boolean\n withTimer: boolean\n withTitle: boolean\n}\n\ntype ExtendedAlertProps = AlertProps & AdditionalAlertTypes\n\nexport const Root = styled.div.withConfig<ExtendedAlertProps>({\n shouldForwardProp: (prop) => ['children', 'className', 'style'].includes(prop),\n})`\n display: flex;\n align-items: ${(props) => (props.column || (props.isCompact && !props.withTimer) ? 'flex-start' : 'center')};\n justify-content: ${(props) => (props.withTimer ? 'space-between' : 'flex-start')};\n padding: ${(props) =>\n // prettier-ignore\n props.isCompact\n ? props.column\n ? '16px'\n : props.withTimer\n ? '5px 12px 5px 16px'\n : '12px 12px 12px 16px'\n : props.column\n ? '16px'\n : props.withImage\n ? '8px 16px'\n : props.withTimer\n ? '2px 16px 2px 20px'\n : '12px 16px 12px 20px'};\n padding-left: ${(props) =>\n // prettier-ignore\n props.isCompact\n ? props.withTitle\n ? (props.withImage || !props.noIcon) ? '16px' : '20px'\n : props.withImage\n ? '12px'\n : props.withAction && props.noIcon\n ? '20px'\n : '16px'\n : props.withTitle\n ? (props.withImage || !props.noIcon) ? '16px' : '24px'\n : props.withImage ? '16px' : '20px'};\n padding-right: ${(props) =>\n // prettier-ignore\n props.withCloseIcon\n ? props.isCompact ? '12px' : '16px'\n : props.withTimer ? '8px' : '20px'};\n height: ${(props) =>\n // prettier-ignore\n props.isCompact\n ? 'auto'\n : props.column ? 'auto' : '48px'};\n max-width: 100%;\n width: ${(props) => `${props.isCompact ? '351px' : 'fit-content'}`};\n border-radius: ${(props) => (props.column ? (props.isCompact ? '20px' : '12px') : '30px')};\n background-color: ${(props) =>\n props.clear ? props.theme.colors['bg-oncolor-primary'] : color(props.type, props.theme)};\n box-shadow: ${(props) => (props.clear ? '0 6px 20px 0 rgba(0, 0, 0, 0.1)' : 'none')};\n box-sizing: border-box;\n\n ${screenS()`\n width: 351px;\n `}\n ${screenXs()`\n width: 304px;\n `}\n\n .iconWrapper {\n display: flex;\n margin-right: ${(props) =>\n // prettier-ignore\n props.isCompact\n ? '8px'\n : props.column\n ? props.withImage ? '8px' : '12px'\n : '8px'};\n\n ${(props) =>\n props.withImage &&\n css`\n img,\n svg {\n height: ${(props: ExtendedAlertProps) =>\n // prettier-ignore\n props.isCompact\n ? '20px'\n : props.column ? '28px' : '32px'};\n width: ${(props) =>\n // prettier-ignore\n props.isCompact\n ? '20px'\n : props.column ? '28px' : '32px'};\n }\n `}\n }\n\n .title {\n display: inline-block;\n margin-top: ${(props) => (props.isCompact ? '0' : '2px')};\n margin-bottom: 8px;\n max-width: 100%;\n vertical-align: middle;\n white-space: nowrap;\n text-overflow: ellipsis;\n font-weight: 700;\n overflow: hidden;\n }\n\n .content {\n display: flex;\n margin-right: auto;\n flex-direction: ${(props) => (props.column ? 'column' : 'row')};\n align-items: ${(props) => (props.column ? 'flex-start' : 'center')};\n max-width: ${(props) => (props.column ? '260px' : 'initial')};\n white-space: ${(props) => (props.column || props.isCompact ? 'normal' : 'nowrap')};\n overflow: ${(props) => (props.column || props.isCompact ? 'auto' : 'hidden')};\n }\n\n .text {\n line-height: ${(props) => (props.isCompact ? '18px' : '20px')};\n color: ${(props) => props.theme.colors['content-oncolor-constant']};\n text-overflow: ${(props) => (props.column || props.isCompact ? 'clip' : 'ellipsis')};\n white-space: ${(props) => (props.column || props.isCompact ? 'pre-wrap' : 'normal')};\n overflow: hidden;\n }\n\n .link {\n display: flex;\n margin-top: ${(props) => (props.column ? (props.isCompact && !props.withTitle ? '4px' : '12px') : 0)};\n margin-left: ${(props) => (props.column ? 0 : '60px')};\n color: ${(props) =>\n props.clear ? props.theme.colors['content-link'] : props.theme.colors['content-oncolor-constant']};\n }\n\n .actions {\n margin-top: ${(props) =>\n // prettier-ignore\n props.column\n ? props.isCompact\n ? props.withTitle ? '16px' : '8px'\n : '16px'\n : 0};\n margin-left: ${(props) => (props.column ? 0 : '60px')};\n }\n\n .primaryAction {\n margin-left: 0;\n }\n\n .secondaryAction {\n margin-right: ${(props) => (props.column ? '4px' : '8px')};\n }\n\n .timer {\n line-height: ${(props) => (props.isCompact ? '12px' : '18px')};\n font-weight: ${(props) => (props.isCompact ? '700' : '400')};\n font-size: ${(props) => (props.isCompact ? '11px' : '14px')};\n color: ${(props) => countdownColor(props.type, props.theme)};\n\n svg {\n transform: rotateY(180deg);\n }\n }\n\n .cancelTimer {\n margin-left: ${(props) => (props.isCompact ? '28px' : '60px')};\n }\n\n .closeIconWrapper {\n display: flex;\n margin-left: ${(props) => (props.withTimer ? '0' : '16px')};\n cursor: pointer;\n }\n`\n"],"names":["Root","styled","div","withConfig","shouldForwardProp","prop","includes","componentId","props","column","isCompact","withTimer","withImage","withTitle","noIcon","withAction","withCloseIcon","clear","theme","colors","type","screenS","_templateObject","_taggedTemplateLiteral","screenXs","_templateObject2","css"],"mappings":"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"}
1
+ {"version":3,"file":"style.js","sources":["../../../../src/components/Alert/style.ts"],"sourcesContent":["import styled, { css, DefaultTheme } from 'styled-components'\n\nimport { screenS, screenXs } from '../../mixins/screen'\n\nimport { AlertProps, AlertType } from './Alert'\n\nconst color = (type: AlertType, theme: DefaultTheme) => {\n switch (type) {\n case 'error':\n return theme.colors['alert-bg-error-200']\n case 'info':\n return theme.colors['bg-brand-primary-200']\n case 'success':\n return theme.colors['alert-bg-success-200']\n case 'warning':\n return theme.colors['alert-bg-warning-200']\n default:\n return theme.colors['bg-oncolor-primary']\n }\n}\n\nconst countdownColor = (type: AlertType, theme: DefaultTheme) => {\n switch (type) {\n case 'error':\n return theme.colors['alert-bg-error-500']\n case 'info':\n return theme.colors['content-brand-primary']\n case 'success':\n return theme.colors['alert-success']\n case 'warning':\n return theme.colors['alert-warning']\n default:\n return theme.colors['content-brand-primary']\n }\n}\n\ntype AdditionalAlertTypes = {\n column: boolean\n isCompact: boolean\n withAction: boolean\n withCloseIcon: boolean\n withImage: boolean\n withLink: boolean\n withTimer: boolean\n withTitle: boolean\n}\n\ntype ExtendedAlertProps = AlertProps & AdditionalAlertTypes\n\nexport const Root = styled.div.withConfig<ExtendedAlertProps>({\n shouldForwardProp: (prop) => ['children', 'className', 'style'].includes(prop),\n})`\n display: flex;\n align-items: ${(props) => (props.column || (props.isCompact && !props.withTimer) ? 'flex-start' : 'center')};\n justify-content: ${(props) => (props.withTimer ? 'space-between' : 'flex-start')};\n padding: ${(props) =>\n // prettier-ignore\n props.isCompact\n ? props.column\n ? '16px'\n : props.withTimer\n ? '5px 12px 5px 16px'\n : '12px 12px 12px 16px'\n : props.column\n ? '16px'\n : props.withImage\n ? '8px 16px'\n : props.withTimer\n ? '2px 16px 2px 20px'\n : '12px 16px 12px 20px'};\n padding-left: ${(props) =>\n // prettier-ignore\n props.isCompact\n ? props.withTitle\n ? (props.withImage || !props.noIcon) ? '16px' : '20px'\n : props.withImage\n ? '12px'\n : props.withAction && props.noIcon\n ? '20px'\n : '16px'\n : props.withTitle\n ? (props.withImage || !props.noIcon) ? '16px' : '24px'\n : props.withImage ? '16px' : '20px'};\n padding-right: ${(props) =>\n // prettier-ignore\n props.withCloseIcon\n ? props.isCompact ? '12px' : '16px'\n : props.withTimer ? '8px' : '20px'};\n height: ${(props) =>\n // prettier-ignore\n props.isCompact\n ? 'auto'\n : props.column ? 'auto' : '48px'};\n max-width: 100%;\n width: ${(props) => `${props.isCompact ? '351px' : 'fit-content'}`};\n border-radius: ${(props) => (props.column ? (props.isCompact ? '20px' : '12px') : '30px')};\n background-color: ${(props) =>\n props.clear ? props.theme.colors['bg-oncolor-primary'] : color(props.type, props.theme)};\n box-shadow: ${(props) => (props.clear ? '0 6px 20px 0 rgba(0, 0, 0, 0.1)' : 'none')};\n box-sizing: border-box;\n\n ${screenS()`\n width: 351px;\n `}\n ${screenXs()`\n width: 304px;\n `}\n\n .iconWrapper {\n display: flex;\n margin-right: ${(props) =>\n // prettier-ignore\n props.isCompact\n ? '8px'\n : props.column\n ? props.withImage ? '8px' : '12px'\n : '8px'};\n\n ${(props) =>\n props.withImage &&\n css`\n img,\n svg {\n height: ${(props: ExtendedAlertProps) =>\n // prettier-ignore\n props.isCompact\n ? '20px'\n : props.column ? '28px' : '32px'};\n width: ${(props) =>\n // prettier-ignore\n props.isCompact\n ? '20px'\n : props.column ? '28px' : '32px'};\n }\n `}\n }\n\n .title {\n display: inline-block;\n margin-top: ${(props) => (props.isCompact ? '0' : '2px')};\n margin-bottom: 8px;\n max-width: 100%;\n vertical-align: middle;\n white-space: nowrap;\n text-overflow: ellipsis;\n font-weight: 700;\n overflow: hidden;\n }\n\n .content {\n display: flex;\n margin-right: auto;\n flex-direction: ${(props) => (props.column ? 'column' : 'row')};\n align-items: ${(props) => (props.column ? 'flex-start' : 'center')};\n max-width: ${(props) => (props.column ? '260px' : 'initial')};\n white-space: ${(props) => (props.column || props.isCompact ? 'normal' : 'nowrap')};\n overflow: ${(props) => (props.column || props.isCompact ? 'auto' : 'hidden')};\n }\n\n .text {\n line-height: ${(props) => (props.isCompact ? '18px' : '20px')};\n color: ${(props) => props.theme.colors['content-oncolor-constant']};\n text-overflow: ${(props) => (props.column || props.isCompact ? 'clip' : 'ellipsis')};\n white-space: ${(props) => (props.column || props.isCompact ? 'pre-wrap' : 'inherit')};\n overflow: hidden;\n }\n\n .link {\n display: flex;\n margin-top: ${(props) => (props.column ? (props.isCompact && !props.withTitle ? '4px' : '12px') : 0)};\n margin-left: ${(props) => (props.column ? 0 : '60px')};\n color: ${(props) =>\n props.clear ? props.theme.colors['content-link'] : props.theme.colors['content-oncolor-constant']};\n }\n\n .actions {\n margin-top: ${(props) =>\n // prettier-ignore\n props.column\n ? props.isCompact\n ? props.withTitle ? '16px' : '8px'\n : '16px'\n : 0};\n margin-left: ${(props) => (props.column ? 0 : '60px')};\n }\n\n .primaryAction {\n margin-left: 0;\n }\n\n .secondaryAction {\n margin-right: ${(props) => (props.column ? '4px' : '8px')};\n }\n\n .timer {\n line-height: ${(props) => (props.isCompact ? '12px' : '18px')};\n font-weight: ${(props) => (props.isCompact ? '700' : '400')};\n font-size: ${(props) => (props.isCompact ? '11px' : '14px')};\n color: ${(props) => countdownColor(props.type, props.theme)};\n\n svg {\n transform: rotateY(180deg);\n }\n }\n\n .cancelTimer {\n margin-left: ${(props) => (props.isCompact ? '28px' : '60px')};\n }\n\n .closeIconWrapper {\n display: flex;\n margin-left: ${(props) => (props.withTimer ? '0' : '16px')};\n cursor: pointer;\n }\n`\n"],"names":["Root","styled","div","withConfig","shouldForwardProp","prop","includes","componentId","props","column","isCompact","withTimer","withImage","withTitle","noIcon","withAction","withCloseIcon","clear","theme","colors","type","screenS","_templateObject","_taggedTemplateLiteral","screenXs","_templateObject2","css"],"mappings":"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"}